Heim > Web-Frontend > js-Tutorial > Vergleichende Erläuterung der Verwendung der Funktionen append() und appendto() in jQuery

Vergleichende Erläuterung der Verwendung der Funktionen append() und appendto() in jQuery

巴扎黑
Freigeben: 2017-06-24 11:21:23
Original
2108 Leute haben es durchsucht

In diesem Artikel wird die Verwendung von append() und appendto() in jquery anhand von Beispielen analysiert. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

In der Dokumentoperationsmethode von jQuery führen die Methoden append () und appendto () dieselben Aufgaben aus, es gibt jedoch auch Unterschiede zwischen den beiden.

1. append()-Methode: Fügt den angegebenen Inhalt am Ende des ausgewählten Elements ein (aber immer noch innerhalb des Elements).

a. Syntax:

Der Code lautet wie folgt:


$(selector).append(content);
Nach dem Login kopieren

Darunter ist der Parameterinhalt erforderlich und spezifiziert der Inhalt, der angehängt werden soll.

b. Mit der Funktion können Sie Inhalte an das ausgewählte Element anhängen. Die Syntax lautet:

Der Code lautet wie folgt:


$(selector).append(function(index,html));
Nach dem Login kopieren
Unter diesen ist function() erforderlich, und die Parameter index und html sind optional. Der Index stellt die Indexposition des empfangenden Selektors dar, und HTML stellt den aktuellen HTML-Code des empfangenden Selektors dar.

Beispiel:

Der Code lautet wie folgt:


 1 <html> 
 2 <head> 
 3 <script type="text/javascript" src="/jquery/jquery.js"></script> 
 4 <script type="text/javascript"> 
 5 $(document).ready(function(){ 
 6   $("button").click(function(){ 
 7     $("p").append(" <b>Hello jQuery!</b>"); 
 8   }); 
 9 }); 
10 </script> 
11 </head> 
12 <body> 
13 <p>This is a paragraph.</p> 
14 <p>This is another paragraph.</p> 
15 <button>在每个 p 元素的结尾添加内容</button> 
16 </body> 
17 </html>
Nach dem Login kopieren
Das laufende Ergebnis lautet wie folgt:

Dies ist ein Absatz.

Dies ist ein weiterer Absatz.

2. Fügen Sie das angegebene am Ende des ausgewählten Elements ein. aber immer noch innerhalb des Elements) Inhalt. Sie können jedoch keine Funktionen zum Anhängen von Inhalten verwenden. Syntax:

Der Code lautet wie folgt:


Beispiel:
$(content).appendto(selector);
Nach dem Login kopieren

Der Code lautet wie folgt folgt:


Die laufenden Ergebnisse sind wie folgt:
 1 <html> 
 2 <head> 
 3 <script type="text/javascript" src="/jquery/jquery.js"></script> 
 4 <script type="text/javascript"> 
 5 $(document).ready(function(){ 
 6   $("button").click(function(){ 
 7     $("<b> Hello jQuery!</b>").appendTo("p"); 
 8   }); 
 9 }); 
10 </script> 
11 </head> 
12 <body> 
13 <p>This is a paragraph.</p> 
14 <p>This is another paragraph.</p> 
15 <button>在每个 p 元素的结尾添加内容</button> 
16 </body> 
17 </html>
Nach dem Login kopieren

Dies ist ein Absatz Hallo jQuery!

Dies ist ein weiterer Absatz jQuery!


Ich hoffe, dass die Beschreibung in diesem Artikel für alle bei der jQuery-Programmierung hilfreich sein wird.

Das obige ist der detaillierte Inhalt vonVergleichende Erläuterung der Verwendung der Funktionen append() und appendto() 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