recherche

Maison >interface Web >js tutoriel >La différence entre les méthodes append, prepend, avant et après dans jquery

La différence entre les méthodes append, prepend, avant et après dans jquery

巴扎黑
巴扎黑original
2017-06-24 11:20:201622parcourir


1. append() et prepend()

Assomption

<p class=&#39;a&#39;> //<---you want p c to append in this
  <p class=&#39;b&#39;>b</p>
</p>

L'effet de l'utilisation de 

$(&#39;.a&#39;).append($(&#39;.c&#39;));

est le suivant : 

<p class=&#39;a&#39;> //<---you want p c to append in this
  <p class=&#39;b&#39;>b</p>
  <p class=&#39;c&#39;>c</p>
</p>

De même, l'utilisation de 

$(&#39;.a&#39;).prepend($(&#39;.c&#39;));

l'effet est le suivant : 

<p class=&#39;a&#39;> //<---you want p c to append in this
  <p class=&#39;c&#39;>c</p>
  <p class=&#39;b&#39;>b</p>

</p>

2. Utilisez after( ) et before()

utilisez également le code hypothétique : 

$(&#39;.a&#39;).after($(&#39;.c&#39;));

L'effet est le suivant : 

<p class=&#39;a&#39;>
  <p class=&#39;b&#39;>b</p></p><p class=&#39;c&#39;>c</p>

Utiliser de la même manière avant()

$(&#39;.a&#39;).before($(&#39;.c&#39;));

L'effet est le suivant : 

<p class=&#39;c&#39;>c</p><p class=&#39;a&#39;>
  <p class=&#39;b&#39;>b</p></p>

Résumé :

append() & prepend() sont dans l'élément Insérer du contenu à l'intérieur (le contenu devient un élément enfant ou un nœud de l'élément), after() & before() insèrent du contenu à l'extérieur de l'élément (son contenu devient le nœud frère de l'élément).>

1. append() et prepend()
Supposons que

utilise 

<p class=&#39;a&#39;> //<---you want p c to append in this
  <p class=&#39;b&#39;>b</p>
</p>

et l'effet. est le suivant : 

$(&#39;.a&#39;).append($(&#39;.c&#39;));

Utilisez de la même manière 

<p class=&#39;a&#39;> //<---you want p c to append in this
  <p class=&#39;b&#39;>b</p>
  <p class=&#39;c&#39;>c</p>
</p>

et l'effet est le suivant : 

$(&#39;.a&#39;).prepend($(&#39;.c&#39;));

2. Utilisez after() et before() 

<p class=&#39;a&#39;> //<---you want p c to append in this
  <p class=&#39;c&#39;>c</p>
  <p class=&#39;b&#39;>b</p>

</p>
Utilisez de la même manière le code hypothétique :

L'effet est le suivant : 

$(&#39;.a&#39;).after($(&#39;.c&#39;));

Utilisez de la même manière avant()

<p class=&#39;a&#39;>
  <p class=&#39;b&#39;>b</p></p><p class=&#39;c&#39;>c</p>

L'effet est le suivant : 

$(&#39;.a&#39;).before($(&#39;.c&#39;));

Résumé : 

<p class=&#39;c&#39;>c</p><p class=&#39;a&#39;>
  <p class=&#39;b&#39;>b</p></p>
append() et prepend() servent à insérer du contenu à l'intérieur de l'élément (le contenu devient l'élément enfant ou le nœud de l'élément) , after() & before() doivent insérer du contenu en dehors de l'élément (le contenu devient le nœud frère de l'élément)).

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Explication détaillée de la fonction jQuery.append()Article suivant：Explication détaillée de la fonction jQuery.append()

Articles Liés

Voir plus