XML DOM - Navigation node
May 27, 2021 XML DOM
Table of contents
XML DOM - Navigation node
You can navigate a node by using relationships between nodes.
Navigate the DOM node
Access nodes in the node tree through relationships between nodes, often referred to as navigation nodes ("navigating nodes").
In XML DOM, the relationship between nodes is defined as the properties of the node:
- parentNode
- childNodes
- firstChild
- lastChild
- nextSibling
- previousSibling
The following image shows a .xml the node tree in the books and explains the relationships between nodes:
DOM - Parent node
All nodes have only one parent. The following code navigates to the parent node of the .lt;book:
x=xmlDoc.getElementsByTagName("book")[0];
document.write(x.parentNode.nodeName);
Try it out . . .
Example explanation:
- Use loadXMLDoc() to load .xml books" into xmlDoc
- Get the first element of the slt;book
- The node name of the parent node that outputs "x"
Avoid empty text nodes
Firefox and other browsers treat empty white space or line-overs as text nodes, which Internet Explorer does not.
This creates a problem when using the following properties: firstChild, lastChild, nextSibling, previousSibling.
To avoid navigating to empty text nodes (spaces and line breaks between element nodes), we use a function to check the node type:
function get_nextSibling(n)
{
y=n.nextSibling;
while (y.nodeType!=1)
{
y=y.nextSibling;
}
return y;
}The above function allows you to get_nextSibling node (node) instead of the node .nextSibling property.
Code interpretation:
The type of element node is 1. I f the peer node is not an element node, move to the next node until the element node is found. In this way, you can get the same results in both Internet Explorer and Firefox.
Gets the first child element
The following code shows the first element of the first .
<head>
<script src="loadxmldoc.js">
</script>
<script>
//check if the first node is an element node
function get_firstChild(n)
{
y=n.firstChild;
while (y.nodeType!=1)
{
y=y.nextSibling;
}
return y;
}
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
x=get_firstChild(xmlDoc.getElementsByTagName("book")[0]);
document.write(x.nodeName);
</script>
</body>
</html>
Output:
Try it out . . .
Example explanation:
- Use loadXMLDoc() to load .xml books" into xmlDoc
- Use the get_firstChild function on the get_firstChild element to get the first child node (which belongs to the element node)
- Outputs the node name of the first child node, which belongs to the element node
More instances
lastChild()
This example uses the lastChild() method and a custom function to get the last child node of the node
nextSibling()
This example uses the nextSibling() method and a custom function to get the next peer node of the node
previousSibling()
This example uses the previousSibling() method and a custom function to get the previous peer node of the node