Heim > Artikel > Web-Frontend > 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

巴扎黑Original: 2017-06-24 13:17:311365Durchsuche

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>

erhält:

p2:wenwen
p1:hello
hello world hello wo

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>

Endlich bekommen:

p1:hello
.p1
p2:wenwen

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;);

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!

Stellungnahme：

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

Vorheriger Artikel：Detaillierte Erläuterung der Funktion jQuery.before()Nächster Artikel：Detaillierte Erläuterung der Funktion jQuery.before()

In Verbindung stehende Artikel

Mehr sehen