11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

j'ai un code html de ce genre


<div id="bidule">
   <h2>titre1</h2>
   ici du htlm,principalement des balises <p> <span> et  <br>
   <h2>titre2</h2>
   ici du htlm,principalement des balises <p> <span> et  <br>
   <h2>titren</h2>
   ici du htlm,principalement des balises <p> <span> et  <br>
</div>


je voudrais transformer ce code en


<div id="bidule">
   <h2>titre1</h2>
        <div class="truc">
         ici du htlm,principalement des balises <p> <span> et  <br>
        </div>
   <h2>titre2</h2>
        <div class="truc">
         ici du htlm,principalement des balises <p> <span> et  <br>
        </div>
   ici du htlm,principalement des balises <p> <span> et  <br>
   <h2>titren</h2>
        <div class="truc">
         ici du htlm,principalement des balises <p> <span> et  <br>
        </div>
</div>


en fait je veux inclure dans un div tout ce qui est après les h2 pour jouer plus finement sur la présentation.
J'ai retourné les méthodes jQuery dans tous les sens .... next() nextSibbling() nextUntil() et autres dans tous les sens et je n'arrive pas à constituer mon code jQuery pour faire cela.

ça doit bien être possible, non??
Modifié par lionel_css3 (23 Jan 2012 - 17:40)
J'ai trouvé une solution, vous en pensez quoi?

jQuery(function()  {
jQuery("#bidule h2").each(function()  {
	jQuery(this).nextUntil("h2").wrapAll("<div class='truc'></div>");
        });
});  

Je boucle sur chaque h2 à l'intérieur de #bidule, je prends tous ses prochains frères jusqu'au h2 suivant et j'englobe tout ça dans un div.truc
Pour le dernier h2 il n'y a pas de h2 après lui, mis apparemment ça fonctionne et ça ne déclenche pas d'erreurs ... peut être parce qu'il n'y a plus de frêre et que la fonction nextUntil s'arrête??

ça fait 2h30 que je galère pour pondre cette ligne de code.... Smiley langue
Franchement, jQuery c'est génial !!