Encapsulation de plusieurs éléments dans jQuery
Il est possible d'encapsuler non pas chaque élément individuellement,
mais tous les éléments trouvés ensemble à l'aide de la méthode
wrapAll.
Le code HTML présente un groupe de paragraphes :
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>
Trouvons tous les paragraphes avec la classe www et
encapsulons-les dans une balise div :
$('.www').wrapAll('<div></div>');
Le code HTML deviendra alors :
<div>
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
</div>
<p>text</p>
Notez que si les éléments à encapsuler ne sont pas
adjacents, la méthode wrapAll va d'abord
déplacer les éléments au même endroit, puis
les encapsulera. Regardez l'exemple suivant :
<p class="www">text1</p>
<p class="www">text2</p>
<p>text</p>
<p class="www">text3</p>
Appliquons la méthode wrapAll :
$('.www').wrapAll('<div></div>');
Au final, nous obtenons le code HTML suivant :
<div>
<p class="www">text1</p>
<p class="www">text2</p>
<p class="www">text3</p>
</div>
<p>text</p>
Les méthodes d'encapsulation d'éléments prévoient également la possibilité d'appliquer une fonction à chaque élément dans l'ensemble.
Encapsulez tous les h2 dans un seul i.