XML DOM - Navigeer nodes
Nodusse kan navigeer word deur gebruik te maak van nodusverhoudings.
Navigeer DOM nodes
Toegang tot nodusse in die nodusboom via die verhouding tussen nodusse, word dikwels "navigerende nodusse" genoem.
In die XML DOM word nodusverhoudings gedefinieer as eienskappe vir die nodusse:
- ouerNode
- kindNodes
- eersteKind
- laasteKind
- volgende Broer en suster
- vorige broer of suster
Die volgende prent illustreer 'n deel van die nodusboom en die verwantskap tussen nodusse in books.xml :
DOM - Ouer Node
Alle nodusse het presies een ouernodus. Die volgende kode navigeer na die ouernodus van <boek>:
Voorbeeld
function myFunction(xml) {
var xmlDoc = xml.responseXML;
var x = xmlDoc.getElementsByTagName("book")[0];
document.getElementById("demo").innerHTML = x.parentNode.nodeName;
}
Voorbeeld verduidelik:
- Laai " books.xml " in xmlDoc
- Kry die eerste <boek>-element
- Voer die nodusnaam van die ouerknoop van "x" uit
Vermy leë teksnodes
Firefox, en sommige ander blaaiers, sal leë spasies of nuwe reëls as teksnodes hanteer, Internet Explorer sal nie.
Dit veroorsaak 'n probleem wanneer die eienskappe gebruik word: firstChild, lastChild, nextSibling, previousSibling.
Om te verhoed dat ons na leë teksnodusse (spasies en nuwereëlkarakters tussen elementnodusse) navigeer, gebruik ons 'n funksie wat die nodustipe kontroleer:
function get_nextSibling(n)
{
var y = n.nextSibling;
while (y.nodeType! = 1)
{
y = y.nextSibling;
}
return y;
}
Die funksie hierbo laat jou toe om get_nextSibling( node ) te gebruik in plaas van die eiendomsnode .nextSibling .
Kode verduidelik:
Element nodusse is tipe 1. As die broer nodus nie 'n element node is nie, beweeg dit na die volgende nodusse totdat 'n element node gevind word. Op hierdie manier sal die resultaat dieselfde wees in beide Internet Explorer en Firefox.
Kry die Eerste Kind Element
Die volgende kode vertoon die eerste element nodus van die eerste <boek>:
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>
Uitset:
title
Voorbeeld verduidelik:
- Laai " books.xml " in xmlDoc
- Gebruik die get_firstChild funksie op die eerste <boek> element node om die eerste kind node te kry wat 'n element node is
- Voer die nodusnaam uit van eerste kindnodus wat 'n elementnodus is
Meer voorbeelde
Hierdie voorbeeld gebruik die lastChild() metode en 'n pasgemaakte funksie om die laaste kindernodus van 'n nodus te kry
Hierdie voorbeeld gebruik die nextSibling() metode en 'n pasgemaakte funksie om die volgende broer of suster van 'n nodus te kry
Hierdie voorbeeld gebruik die previousSibling() metode en 'n pasgemaakte funksie om die vorige broer of suster van 'n nodus te kry