Signatur
Beschreibung
Die schreibgeschützte Eigenschaft childNodes des Node-Interfaces gibt eine live NodeList der Kind-Nodes des gegebenen Elements zurück, wobei dem ersten Kindknoten der Index 0 zugewiesen wird. Kindknoten schließen Elemente, Text und Kommentare ein.
Die Elemente in der Sammlung von Knoten sind Objekte, keine Strings. Um Daten aus Knotenobjekten zu erhalten, verwendet man deren Eigenschaften. Zum Beispiel kann man den Namen des ersten childNode mit elementNodeReference.childNodes[0].nodeName abrufen.
Das document-Objekt selbst hat zwei Kinder: die Doctype-Deklaration und das Wurzelelement, typischerweise als documentElement bezeichnet. In HTML-Dokumenten ist letzteres das <html>-Element.
Es ist wichtig zu beachten, dass childNodes alle Kindknoten einschließt, einschließlich Nicht-Element-Knoten wie Text und Kommentar. Um eine Sammlung zu erhalten, die nur Elemente enthält, verwendet man stattdessen Element.children.
Wert
Eine live NodeList, die die Kinder des Knotens enthält.
Rückgabewert
NodeList, die die Kinder des Knotens enthält.Beispiele
Einfache Verwendung
// Note that para is an object reference to a <p> element
// First check that the element has child nodes
if (para.hasChildNodes()) {
let children = para.childNodes;
for (const node of children) {
// Do something with each child as children[i]
// NOTE: List is live! Adding or removing children will change the list's `length`
}
}
Alle Kinder eines Knotens entfernen
// This is one way to remove all children from a node
// box is an object reference to an element
while (box.firstChild) {
// The list is LIVE so it will re-index each call
box.removeChild(box.firstChild);
}
// Wichtig · Fallstricke
Die NodeList ist live, das heißt ihr Inhalt ändert sich jedes Mal, wenn neue Kinder hinzugefügt oder entfernt werden.
Browser fügen Textknoten in ein Dokument ein, um Whitespace im Quell-Markup zu repräsentieren. Daher kann ein z. B. mit Node.childNodes[0] erhaltener Knoten sich auf einen Whitespace-Textknoten beziehen statt auf das eigentliche Element, das der Autor erhalten wollte.
Mehrere Aufrufe von childNodes geben dieselbe NodeList zurück.