Node: nextSibling-Eigenschaft

Die schreibgeschützte nextSibling-Eigenschaft des Node-Interfaces gibt den Knoten zurück, der unmittelbar auf den angegebenen Knoten im childNodes des Elternteils folgt, oder gibt null zurück, wenn der angegebene Knoten das letzte Kind im Elternelement ist.

Hinweis: Browser fügen Text-Knoten in ein Dokument ein, um Leerzeichen im Quellcode darzustellen. Daher kann ein Knoten, der beispielsweise mit Node.firstChild oder Node.previousSibling abgerufen wird, auf einen Leerzeichen-Textknoten verweisen, anstatt auf das eigentliche Element, das der Autor abrufen wollte.

Der Artikel Whitespace in the DOM enthält weitere Informationen zu diesem Verhalten.

Sie können Element.nextElementSibling verwenden, um das nächste Element zu erhalten und dabei jegliche Leerzeichenknoten, zwischen den Elementen liegende Textknoten oder Kommentare zu überspringen.

Um in umgekehrter Richtung durch die Liste der Kindknoten zu navigieren, verwenden Sie Node.previousSibling.

Wert

Ein Node, der das nächste Geschwisterknoten des aktuellen Knotens darstellt, oder null, wenn kein Knoten vorhanden ist.

Beispiel

html
<div id="div-1">Here is div-1</div>
<div id="div-2">Here is div-2</div>
<br />
<output><em>Not calculated.</em></output>
js
let el = document.getElementById("div-1").nextSibling;
let i = 1;

let result = "Siblings of div-1:\n";

while (el) {
  result += `${i}. ${el.nodeName}\n`;
  el = el.nextSibling;
  i++;
}

const output = document.querySelector("output");
output.innerText = result;

Spezifikationen

Specification
DOM Standard
# ref-for-dom-node-nextsibling①

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch