Element.append() — Methode · JavaScript-Referenz

Signatur

append(param1) / append(param1, param2) / append(param1, param2, /* …, */ paramN)

Beschreibung

Die Methode Element.append() fügt eine Menge von Node-Objekten oder Strings nach dem letzten Kind des Element ein. Strings werden als entsprechende Text-Knoten eingefügt.

Unterschiede zu Node.appendChild():

Element.append() erlaubt es Ihnen, auch Strings anzuhängen, während Node.appendChild() nur Node-Objekte akzeptiert.
Element.append() hat keinen Rückgabewert, während Node.appendChild() das angehängte Node-Objekt zurückgibt.
Element.append() kann mehrere Knoten und Strings anhängen, während Node.appendChild() nur einen Knoten anhängen kann.

Parameter

Name	Typ	Default	Beschreibung
$param1, …, paramN Pflicht	Node \| string	—	Eine Menge von `Node`-Objekten oder Strings, die eingefügt werden sollen.

Rückgabewert

Typ

undefined

Beschreibung

Keiner (undefined).

Beispiele

Ein Element anhängen

let div = document.createElement("div");
let p = document.createElement("p");
div.append(p);

console.log(div.childNodes); // NodeList [ <p> ]

Text anhängen

let div = document.createElement("div");
div.append("Some text");

console.log(div.textContent); // "Some text"

Ein Element und Text anhängen

let div = document.createElement("div");
let p = document.createElement("p");
div.append("Some text", p);

console.log(div.childNodes); // NodeList [ #text "Some text", <p> ]

Die append-Methode ist unscopable

let div = document.createElement("div");

with (div) {
  append("foo");
}
// ReferenceError: append is not defined

// Wichtig · Fallstricke

Die Methode append() ist nicht in die with-Anweisung eingebunden. Siehe Symbol.unscopables für weitere Informationen. Eine HierarchyRequestError-DOMException wird ausgelöst, wenn der Knoten an der angegebenen Stelle in der Hierarchie nicht eingefügt werden kann.

Siehe auch

Element.prepend() Node.appendChild() Element.after() Element.insertAdjacentElement() NodeList CSSPseudoElement.pseudo() FileSystemEntry.getParent()