Méthode wrap
La méthode wrap encapsule
les éléments dans une balise donnée.
Syntaxe
Le paramètre de la méthode peut être du texte (éventuellement avec des balises), un élément DOM ou un objet jQuery :
.wrap(quoi encapsuler);
Voici comment les éléments sélectionnés sont encapsulés dans un contenu, qui sera retourné par une fonction utilisateur. La fonction est appelée séparément, pour chacun des éléments sélectionnés, en tant que paramètre accepte la position de l'élément dans l'ensemble :
.wrap(function(numéro dans l'ensemble));
Exemple
Encapsulons tous les paragraphes avec la classe www dans la balise
div :
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>
$('.www').wrap(document.createElement('div'));
Le code HTML deviendra ainsi :
<div><p class="www">text</p></div>
<div><p class="www">text</p></div>
<div><p class="www">text</p></div>
<p>text</p>
Exemple
En paramètre, on peut passer non seulement le nom de la balise, mais aussi la construction suivante :
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>
$('.www').wrap('<div></div>');
Le code HTML deviendra ainsi :
<div><p class="www">text</p></div>
<div><p class="www">text</p></div>
<div><p class="www">text</p></div>
<p>text</p>
Exemple
Dans la balise ouvrante, on peut écrire n'importe quels attributs,
l'encapsulation se fera alors avec ces
attributs. Encapsulons les paragraphes avec la classe
www dans un div avec la classe zzz :
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>
$('.www').wrap('<div class="zzz"></div>');
Le code HTML deviendra ainsi :
<div class="zzz"><p class="www">text</p></div>
<div class="zzz"><p class="www">text</p></div>
<div class="zzz"><p class="www">text</p></div>
<p>text</p>