节点可以使用节点的关系进行导航。
导航DOM节点
经由节点之间关系的访问在节点树中的节点，通常被称为"navigating nodes" 。
在XML的DOM，节点的关系被定义为属性的节点：
- parentNode
- childNodes
- firstChild
- lastChild
- nextSibling
- previousSibling
下图说明了节点树和节点之间的关系中的一部分的books.xml ：
DOM - 父节点
所有节点都有一个父节点。 下面的代码浏览到的父节点<book> ：
例
function myFunction(xml) {
var xmlDoc = xml.responseXML;
var x = xmlDoc.getElementsByTagName("book")[0];
document.getElementById("demo").innerHTML = x.parentNode.nodeName;
}
试一试» 例子解释：
- 装载“ 的books.xml ”载入xmlDoc
- 获取第<book>元素
- 输出的父节点的节点名称"x"
避免空文本节点
Firefox和其他一些浏览器，会把空的空白或换行作为文本节点，而Internet Explorer将不会。
则firstChild，lastChild，nextSibling，previousSibling：使用属性时，这会导致一个问题。
为了避免导航到空的文本节点（元素节点之间的空格和换行字符），我们使用检查节点类型的函数：
function get_nextSibling(n)
{
var y = n.nextSibling;
while (y.nodeType! = 1)
{
y = y.nextSibling;
}
return y;
}
上面的功能，允许您使用get_nextSibling( node ) ，而不是属性node .nextSibling。
代码解释：
元素节点的类型是1.如果同级节点不是元素节点，直到元素节点发现它移动到下一个节点。 这样一来，其结果将是在Internet Explorer和Firefox相同。
获取的第一个子元素
下面的代码显示第一个的第一个元素节点<book> ：
例
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {
myFunction(xhttp);
}
};
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>
输出：
title
试一试» 例子解释：
- 装载“ 的books.xml ”载入xmlDoc
- 使用第一个上get_firstChild功能<book>元素节点来获取是元素节点的第一个子节点
- 输出第一个子节点的节点名称是元素节点
更多示例
lastChild()
本例使用lastChild()方法和一个自定义函数来获取节点的最后一个子节点
nextSibling()
本例使用nextSibling()方法和一个自定义函数来获取节点的下一个兄弟节点
previousSibling()
本例使用previousSibling()方法和一个自定义函数来获取一个节点的前一个兄弟节点