Heim > Web-Frontend > js-Tutorial > So fügen Sie Elemente mithilfe der Append-Methode in jQuery hinzu

So fügen Sie Elemente mithilfe der Append-Methode in jQuery hinzu

不言
Freigeben: 2018-12-28 17:35:09
Original
6334 Leute haben es durchsucht

Die Append-Methode ist eine Methode, die HTML-Elemente dynamisch hinzufügen kann. Sie können eine beliebige Anzahl von HTML-Elementen hinzufügen Append-Methode.

So fügen Sie Elemente mithilfe der Append-Methode in So fügen Sie Elemente mithilfe der Append-Methode in So fügen Sie Elemente mithilfe der Append-Methode in jQuery hinzu hinzu hinzu

Wie verwende ich die Append-Methode?

$(‘选择器’).append(‘添加的内容’);
Nach dem Login kopieren

Nachdem Sie die Klasse und ID im Selektor angegeben haben, rufen Sie append auf und geben Sie an, was hinzugefügt werden soll.

Sehen wir uns ein konkretes Beispiel an

Fügen Sie das li-Element im ul-Tag hinzu, indem Sie auf die Schaltfläche klicken. Der Code lautet wie folgt

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script>
      $(function() {
        $("button").click(function() {
          $("ul").append("<li>添加的内容</li>");
        });
      });
    </script>
  </head>
  <body>
    <button>button</button>
    <ul>
    </ul>
  </body>
</html>
Nach dem Login kopieren

Erstellen Sie ein Ereignis, das ausgelöst werden soll, wenn Klicken Sie auf die Schaltfläche und führen Sie dann die darin enthaltene Append-Methode aus.

Schreiben Sie eine Anhängemethode für den Selektor, geben Sie das ul-Tag an und fügen Sie das li-Tag zum Selektor hinzu.

Bei jedem Tastendruck wird also die Append-Methode aufgerufen und die Anzahl der Elemente erhöht.

Der Anzeigeeffekt im Browser ist wie folgt

So fügen Sie Elemente mithilfe der Append-Methode in So fügen Sie Elemente mithilfe der Append-Methode in So fügen Sie Elemente mithilfe der Append-Methode in jQuery hinzu hinzu hinzu

Wenn auf die Schaltfläche geklickt wird, wird bei jedem Klick ein Inhalt angezeigt Der Effekt von fünf Klicks ist wie folgt:

So fügen Sie Elemente mithilfe der Append-Methode in So fügen Sie Elemente mithilfe der Append-Methode in So fügen Sie Elemente mithilfe der Append-Methode in jQuery hinzu hinzu hinzu

Dieser Artikel endet hier. Weitere spannende Inhalte finden Sie in den entsprechenden Tutorial-Kolumnen der PHP-Chinese-Website! ! !

Das obige ist der detaillierte Inhalt vonSo fügen Sie Elemente mithilfe der Append-Methode in jQuery hinzu. 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