Node: previousSibling-Eigenschaft
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
Die schreibgeschützte previousSibling-Eigenschaft des Node-Interfaces gibt den Knoten zurück, der in der childNodes-Liste des übergeordneten Knotens unmittelbar dem angegebenen Knoten vorausgeht, oder null, wenn der angegebene Knoten der erste in dieser Liste ist.
Hinweis:
Browser fügen einem Dokument Textknoten hinzu, um Leerzeichen im Quellcode darzustellen.
Daher kann ein Knoten, der beispielsweise mit Node.firstChild oder Node.previousSibling erhalten wird, auf einen Leerzeichen-Textknoten verweisen, anstatt auf das tatsächliche Element, das der Autor erhalten wollte.
Weitere Informationen finden Sie unter Arbeiten mit Leerzeichen im DOM.
Sie können previousElementSibling verwenden, um den vorherigen Element-Knoten zu erhalten (um Textknoten und andere Nicht-Element-Knoten zu überspringen).
Um in die entgegengesetzte Richtung durch die childNodes-Liste zu navigieren, verwenden Sie Node.nextSibling.
Wert
Ein Node, der das vorherige Geschwisterkind des aktuellen Knotens darstellt, oder null, wenn es keines gibt.
Beispiele
Die folgenden Beispiele zeigen, wie previousSibling mit und ohne Textknoten funktioniert, die zwischen den Elementen gemischt sind.
Erstes Beispiel
In diesem Beispiel haben wir eine Reihe von img-Elementen, die direkt nebeneinander liegen, ohne Leerzeichen dazwischen.
<img id="b0" /><img id="b1" /><img id="b2" />
document.getElementById("b1").previousSibling; // <img id="b0">
document.getElementById("b2").previousSibling.id; // "b1"
Zweites Beispiel
In diesem Beispiel befinden sich Leerzeichentextknoten (Zeilenumbrüche) zwischen den img-Elementen.
<img id="b0" />
<img id="b1" />
<img id="b2" />
document.getElementById("b1").previousSibling; // #text
document.getElementById("b1").previousSibling.previousSibling; // <img id="b0">
document.getElementById("b2").previousSibling.previousSibling; // <img id="b1">
document.getElementById("b2").previousSibling; // #text
document.getElementById("b2").previousSibling.id; // undefined
Spezifikationen
| Specification |
|---|
| DOM # ref-for-dom-node-previoussibling① |
Browser-Kompatibilität
Loading…