XML DOM - Navigationsknoten
Knoten können mithilfe von Knotenbeziehungen navigiert werden.
Navigieren in DOM-Knoten
Der Zugriff auf Knoten im Knotenbaum über die Beziehung zwischen Knoten wird oft als "Navigationsknoten" bezeichnet.
Im XML-DOM werden Knotenbeziehungen als Eigenschaften zu den Knoten definiert:
- Elternknoten
- untergeordnete Knoten
- erstes Kind
- letztes Kind
- nächstesGeschwister
- vorherigeGeschwister
Das folgende Bild veranschaulicht einen Teil der Knotenstruktur und die Beziehung zwischen Knoten in books.xml :
DOM - Übergeordneter Knoten
Alle Knoten haben genau einen Elternknoten. Der folgende Code navigiert zum übergeordneten Knoten von <book>:
Beispiel
function myFunction(xml) {
var xmlDoc = xml.responseXML;
var x = xmlDoc.getElementsByTagName("book")[0];
document.getElementById("demo").innerHTML = x.parentNode.nodeName;
}
Beispiel erklärt:
- Laden Sie „ books.xml “ in xmlDoc
- Rufen Sie das erste <book>-Element ab
- Ausgabe des Knotennamens des Elternknotens von "x"
Vermeiden Sie leere Textknoten
Firefox und einige andere Browser behandeln leere Leerzeichen oder neue Zeilen als Textknoten, Internet Explorer nicht.
Dies verursacht ein Problem bei der Verwendung der Eigenschaften: firstChild, lastChild, nextSibling, previousSibling.
Um das Navigieren zu leeren Textknoten (Leerzeichen und Zeilenumbruchzeichen zwischen Elementknoten) zu vermeiden, verwenden wir eine Funktion, die den Knotentyp überprüft:
function get_nextSibling(n)
{
var y = n.nextSibling;
while (y.nodeType! = 1)
{
y = y.nextSibling;
}
return y;
}
Die obige Funktion ermöglicht es Ihnen, get_nextSibling( node ) anstelle der Eigenschaft node .nextSibling zu verwenden.
Code erklärt:
Elementknoten sind vom Typ 1. Wenn der Geschwisterknoten kein Elementknoten ist, bewegt er sich zu den nächsten Knoten, bis ein Elementknoten gefunden wird. Auf diese Weise ist das Ergebnis in Internet Explorer und Firefox gleich.
Holen Sie sich das erste untergeordnete Element
Der folgende Code zeigt den ersten Elementknoten des ersten <book> an:
Beispiel
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
myFunction(this);
}
};
xhttp.open("GET",
"books.xml", true);
xhttp.send();
function myFunction(xml) {
var xmlDoc = xml.responseXML;
var x = get_firstChild(xmlDoc.getElementsByTagName("book")[0]);
document.getElementById("demo").innerHTML = x.nodeName;
}
//check if
the first node is an element node
function get_firstChild(n) {
var y = n.firstChild;
while (y.nodeType != 1) {
y = y.nextSibling;
}
return y;
}
</script>
</body>
</html>
Ausgabe:
title
Beispiel erklärt:
- Laden Sie „ books.xml “ in xmlDoc
- Verwenden Sie die get_firstChild-Funktion für den ersten <book>-Elementknoten, um den ersten untergeordneten Knoten abzurufen, der ein Elementknoten ist
- Ausgabe des Knotennamens des ersten untergeordneten Knotens, der ein Elementknoten ist
Mehr Beispiele
Dieses Beispiel verwendet die lastChild()-Methode und eine benutzerdefinierte Funktion, um den letzten untergeordneten Knoten eines Knotens abzurufen
Dieses Beispiel verwendet die Methode nextSibling() und eine benutzerdefinierte Funktion, um den nächsten gleichgeordneten Knoten eines Knotens abzurufen
Dieses Beispiel verwendet die Methode previousSibling() und eine benutzerdefinierte Funktion, um den vorherigen gleichgeordneten Knoten eines Knotens abzurufen