Was ist die Methode append() in JavaScript

Angenommen, Sie möchten eine Liste erstellen und mehrere Elemente hinzufügen. Es nimmt viel Zeit in Anspruch, wenn es manuell durchgeführt wird. JavaScript stellt dazu die „ anhängen () ”-Methode, um ein Objekt als Argument zu nehmen und es dann am Ende der definierten Liste einzufügen. Außerdem können Sie die Elemente auch anders anhängen, wie in der Liste oder in Absatzform.

Dieser Beitrag hat die Methode zum Suchen einer Objekt-ID in einem Array von JavaScript-Objekten angegeben.

Was ist die Methode append() in JavaScript?

Der ' anhängen () ”-Methode in JavaScript wird zum Einfügen der Elemente oder String-Objekte am Ende des Elements verwendet. Dies ist eine der nützlichsten Methoden, um das erforderliche Element an der angegebenen Position am Ende des Elements hinzuzufügen.

Wie verwende ich die Methode append() in JavaScript?

Um die Funktion append() in JavaScript zu verwenden, befolgen Sie die unten angegebene Syntax:

＄ ( Wähler ) . anhängen ( Inhalt, Funktion ( index, html ) )

Hier:

„ Wähler “ ist das HTML-Element, auf das zugegriffen wird.
„ anhängen () ”-Methode wird verwendet, um das Element anzuhängen.
„ Inhalt ” ist der erforderliche Parameter, der den anzuhängenden Dateninhalt bestimmt.
„ Funktion() “ ist ein optionales Element.

Beispiel 1: Gleiches Element im Absatz anhängen

Um die gleichen Elemente in einem Absatz anzufügen, öffnen Sie zunächst die entsprechende HTML-Seite und verwenden Sie das „

”-Tag, um Daten zwischen den Tags einzubetten. Weisen Sie außerdem ein „ Ausweis ” zum Absatz, um in JavaScript darauf zuzugreifen:

< p-ID = 'Element' > Willkommen bei Linuxhint P >

Erstellen Sie als Nächstes eine Schaltfläche mit Hilfe des „ ” Element und verwenden Sie das “ Klasse ”-Attribut, um einen bestimmten Namen anzugeben und Text mit Schaltflächenelement einzubetten, der auf der Schaltfläche angezeigt werden soll:

< Taste Klasse = 'btn' > Element anhängen Taste >

Nutzen Sie jetzt die „ ”-Tag, um den JavaScript-Code hinzuzufügen:

< Skript >

$ ( dokumentieren ) . bereit ( Funktion ( ) {

$ ( '.btn' ) . klicken ( Funktion ( ) {

$ ( '#Element' ) . anhängen ( 'Text bei Klick auf Schaltfläche anfügen' ) ;

} ) ;

} ) ;

Skript >

Nach dem angegebenen Code:

„ bereit() ”-Methode wird verwendet, um eine Funktion verfügbar zu machen, wenn das Dokument erfolgreich auf dem Bildschirm geladen wird. Übergeben Sie dazu die „ Funktion() ”-Methode als Parameter.
„ klicken() “-Methode wird aufgerufen, wenn der Benutzer auf das HTML-Schaltflächenelement klickt. Diese Methode bestimmt die Ausführung des Klicks, wenn ein Benutzer auf die Schaltfläche klickt.
„ anhängen () “-Methode fügt eine Reihe von Objekten nach Ausführung der „ klicken() ' Methode. Übergeben Sie dazu den anzuhängenden Text.

Ausgang

Beispiel 2: Verschiedene Elemente in Listenform anhängen

Sie können die verschiedenen Elemente in Form einer Liste anhängen. Erstellen Sie dazu eine HTML-Seite und betten Sie Text mit Hilfe des „

' Schild:

< p-ID = 'anhängen' > JavaScript anhängen ( ) Funktion P >

Erstellen Sie eine Schaltfläche mit dem „ ” Element und verwenden Sie das “ anklicken ”-Ereignis, das auftritt, wenn ein Benutzer auf ein HTML-Element klickt:

< Schaltfläche anklicken = 'funktion()' > Elemente anhängen Taste >

Erstellen Sie einen div-Container und weisen Sie diesem Container eine ID zu, indem Sie das „ Ausweis ” Attribut. Als nächstes fügen Sie die Elemente mit Hilfe des „

' Schild:

< Div.-ID = 'Mehr-Element' >

< P > Element 1 P >

< P > Element 2 P >

div >

Als nächstes verwendet das „ ”-Tag und fügen Sie den folgenden Code zwischen dem Tag ein:

< Skript >

var Elementnummer = 3 ;

Funktion Funk ( ) {

war ein Elternteil = dokumentieren. getElementById ( 'Mehr-Element' ) ;

war newElement = '

Element' + Elementnummer + '

' ;

Elternteil. InsertAdjacentHTML ( 'vorher' , und Element ) ;

Elementnummer ++;

}

Skript >

Im oben genannten Code:

Deklarieren Sie eine Variable mit dem „ War ” Schlüsselwort und weisen Sie ihm einen Wert nach Ihren Wünschen zu.
Definieren Sie eine Funktion und initialisieren Sie eine andere Variable innerhalb der definierten Funktion mit einem bestimmten Namen.
Rufen Sie dann das „ getElementById() ” JavaScript-Methode, um auf das Element zuzugreifen und den id-Wert als Parameter zu übergeben.
„ insertAdjacentHTML() ”-Methode wird verwendet, um den HTML-Code an einer bestimmten Position hinzuzufügen und das Element nebeneinander hinzuzufügen.
Verwenden Sie den Inkrementoperator, um das Element zu inkrementieren:

Sie haben die Verwendung der Methode append() in JavaScript anhand verschiedener Beispiele kennengelernt.

Abschluss

„ anhängen () “ ist eine JavaScript-Methode, die zum Einfügen des Elements und der Objekte am Ende des definierten Elements verwendet wird. Sie können dasselbe Element und verschiedene Elemente in Form von Absätzen und Listen anhängen. Genauer gesagt kann es durch einen Klick auf eine Schaltfläche ausgelöst werden. Dieser Beitrag hat die Methode append() in JavaScript demonstriert.

Was ist die Methode append() in JavaScript