XML DOM - Navigeren in knooppunten
Knooppunten kunnen worden genavigeerd met behulp van knooppuntrelaties.
Navigeren door DOM-knooppunten
Toegang tot knooppunten in de knooppuntenboom via de relatie tussen knooppunten, wordt vaak "navigerende knooppunten" genoemd.
In de XML DOM worden knooppuntrelaties gedefinieerd als eigenschappen voor de knooppunten:
- parentNode
- childNodes
- eerstgeborene
- laatste kind
- volgendeSibling
- vorigeBroer/zus
De volgende afbeelding illustreert een deel van de knooppuntenstructuur en de relatie tussen knooppunten in books.xml :
DOM - Bovenliggend knooppunt
Alle knooppunten hebben precies één bovenliggend knooppunt. De volgende code navigeert naar het bovenliggende knooppunt van <book>:
Voorbeeld
function myFunction(xml) {
var xmlDoc = xml.responseXML;
var x = xmlDoc.getElementsByTagName("book")[0];
document.getElementById("demo").innerHTML = x.parentNode.nodeName;
}
Voorbeeld uitgelegd:
- Laad " books.xml " in xmlDoc
- Verkrijg het eerste <book> element
- Voer de knooppuntnaam van het bovenliggende knooppunt van "x" uit
Vermijd lege tekstknooppunten
Firefox en sommige andere browsers zullen lege spaties of nieuwe regels als tekstknooppunten behandelen, Internet Explorer niet.
Dit veroorzaakt een probleem bij het gebruik van de eigenschappen: firstChild, lastChild, nextSibling, previousSibling.
Om het navigeren naar lege tekstknooppunten (spaties en nieuwe-regeltekens tussen elementknooppunten) te vermijden, gebruiken we een functie die het knooppunttype controleert:
function get_nextSibling(n)
{
var y = n.nextSibling;
while (y.nodeType! = 1)
{
y = y.nextSibling;
}
return y;
}
Met de functie hierboven kunt u get_nextSibling( node ) gebruiken in plaats van de eigenschap node .nextSibling.
Code uitgelegd:
Elementknooppunten zijn van het type 1. Als het zusterknooppunt geen elementknooppunt is, gaat het naar de volgende knooppunten totdat een elementknooppunt is gevonden. Op deze manier is het resultaat hetzelfde in zowel Internet Explorer als Firefox.
Verkrijg het eerste onderliggende element
De volgende code geeft het eerste elementknooppunt van het eerste <boek> weer:
Voorbeeld
<!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>
Uitgang:
title
Voorbeeld uitgelegd:
- Laad " books.xml " in xmlDoc
- Gebruik de functie get_firstChild op het eerste <book> elementknooppunt om het eerste onderliggende knooppunt te krijgen dat een elementknooppunt is
- Voer de knooppuntnaam uit van het eerste onderliggende knooppunt dat een elementknooppunt is
Meer voorbeelden
Dit voorbeeld gebruikt de methode lastChild() en een aangepaste functie om het laatste onderliggende knooppunt van een knooppunt te krijgen
Dit voorbeeld gebruikt de methode nextSibling() en een aangepaste functie om het volgende knooppunt van een knooppunt op te halen
In dit voorbeeld wordt de methode previousSibling() en een aangepaste functie gebruikt om het vorige zusterknooppunt van een knooppunt te krijgen