Heim > Web-Frontend > js-Tutorial > Einführung in die Unterschiede zwischen insertBefore(), insertAfter(), after() und before() in jQuery

Einführung in die Unterschiede zwischen insertBefore(), insertAfter(), after() und before() in jQuery

巴扎黑
Freigeben: 2017-06-24 13:17:31
Original
1411 Leute haben es durchsucht

In diesem Artikel werden hauptsächlich die Unterschiede zwischen insertBefore(), insertAfter(), after() und before() in jQuery vorgestellt. Die Informationen sind Sehr gut und hat einen Referenzwert. Freunde, die es brauchen, können darauf verweisen

insertBefore():a.insertBefore(b)

 a ist vorne, b ist hinten ,

a: ist ein Selektor, b: ist auch ein Selektor


<!DOCTYPE html>
<html>
<head>
<meta charset=&#39;UTF-8&#39;>
<title>jqu</title>
<script type="text/javascript" src=&#39;jquery-2.2.0.min.js&#39;></script>
</head>
<body>
<p class=&#39;p1&#39;>p1:hello</p>
hello world
<p class=&#39;p2&#39;>p2:wenwen</p>
hello wo
</body>
<script type="text/javascript">
$(function(){
$(&#39;.p2&#39;).insertBefore(&#39;.p1&#39;);
})
</script>
</html>
Nach dem Login kopieren

erhält:


p2:wenwen
p1:hello
hello world hello wo
Nach dem Login kopieren

insertAfter(): Das Gleiche wie insertBefore()

 a.insertAfter(b)

A kommt danach, b kommt davor

Jetzt ist es before()

before():a.before()

a is ein vorhandener Selektor auf der Seite, b ist der Inhalt, den Sie hinzufügen müssen, Hinweis: Es ist, was es ist, es erkennt das Tag, b ist kein Selektor

 a kommt danach, b kommt vorher


<!DOCTYPE html>
<html>
<head>
<meta charset=&#39;UTF-8&#39;>
<title>jqu</title>
<script type="text/javascript" src=&#39;jquery-2.2.0.min.js&#39;></script>
</head>
<body>
<p class=&#39;p1&#39;>p1:hello</p>
<p class=&#39;p2&#39;>p2:wenwen</p>
</body>
<script type="text/javascript">
$(function(){
$(&#39;.p2&#39;).before(&#39;.p1&#39;);
})
</script>
</html>
Nach dem Login kopieren

Endlich bekommen:


p1:hello
.p1
p2:wenwen
Nach dem Login kopieren

Siehst du? .p1 erkennt den Selektor nicht, er ist direkt string , vor dem .p2-Selektor

after(): ist dasselbe wie before(), außer One in vorne und einer hinten

Ich möchte nur den Unterschied zwischen insertBefore(), insertAfter() und before(), after() hervorheben Um es zu verwenden, verwenden Sie

insertBefore(), insertAfter()

, wenn Sie die Positionen zweier Selektoren vertauschen müssen aus einem Selektor und einem Text, Sie können einfach before(), after(); verwenden, natürlich geht es dabei nicht nur um das Ändern der Position

Das Vertauschen der Position bedeutet Dinge, die bereits auf der Seite vorhanden sind . Mit dieser Methode können auch Dinge hinzugefügt werden, die nicht auf der Seite sind, wie zum Beispiel:


$(&#39;<p class=&#39;p3&#39;>嘿嘿</p>&#39;).insertBefore(&#39;.p1&#39;);
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonEinführung in die Unterschiede zwischen insertBefore(), insertAfter(), after() und before() in jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage