Source : Wrap all elements from class=“foo” up until class=“bar”
Cette astuce fonctionne même si certains éléments à envelopper contiennent des éléments enfants (voir code HTML ci-dessous).
|
1 2 3 |
$(".foo").each(function () { $(this).nextUntil(".bar + *").addBack().wrapAll("<div class='wrapper'/>"); }); |
Remarque : vous pouvez simplifier le code si aucun des éléments à réunir ne possède d’enfants.
|
1 2 3 |
$(".foo").each(function () { $(this).nextUntil(".bar").addBack().wrapAll("<div class='wrapper'/>"); }); |
Etat du DOM avant manipulation :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<div class="kev">...</div> <div class="foo">...</div> <div class="bob">...</div> <div class="tom">...</div> <div class="bar">...</div> <div class="pat">...</div> <div class="foo"> <div class="tim">...</div> <div class="foo">...</div> <div class="jim">...</div> <div class="bar">...</div> <div class="rob">...</div> </div> <div class="meg">...</div> <div class="bar">...</div> |
Etat du DOM après manipulation :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
<div class="kev">...</div> <div class="wrapper"> <div class="foo">...</div> <div class="bob">...</div> <div class="tom">...</div> <div class="bar">...</div> </div><!--end of wrapper--> <div class="pat">...</div> <div class="wrapper"> <div class="foo"> <div class="tim">...</div> <div class="wrapper"> <div class="foo">...</div> <div class="jim">...</div> <div class="bar">...</div> </div><!--end of wrapper--> <div class="rob">...</div> </div> <div class="meg">...</div> <div class="bar">...</div> </div><!--end of wrapper--> |