在介绍了《JavaScript DOM修改文档树方法实例》与《JavaScript DOM实战：创建和克隆元素》，本文将介绍JavaScript DOM文档遍历的详细知识，我们先从HTML页面最基本的组成元素讨论起：
访问元素，你应该明白它是该文件的document元素，那你就可以使用document的documentElement属性：
varoHtml=document.documentElement;//可以直接访问元素
alert("节点名称:"+oHtml.nodeName);//节点名称
alert("节点类型:"+oHtml.nodeType);//节点类型为1
获取
和 元素：
varoHead=oHtml.firstChild;//HEAD节点
varoBody=oHtml.lastChild;//BODY节点
也可以通过childNodes属性，获取
和 元素：
varoHead=oHtml.childNodes.item(0);//HEAD节点
//varoHead=oHtml.childNodes[0];//简写,也有同样的结果是HEAD节点
varoBody=oHtml.childNodes.item(1);//BODY节点
//varoBody=oHtml.childNodes.item(1);//简写,也有同样的结果是BODY节点
注意：方括号标记其实是NodeList在javascript中的简便实现。实际上正式的从childNodes列表中获取子节点的方法是使用item()方法：HTML DOM 中的专有属性 document.body ，它常用于直接访问元素：
varoBody=document.body;
既然我们都知道了以上节点对象的获取方式，那我们用oHtml，oHead，oBody 这三个变量来确定一下它们之间的关系：
alert(oHead.parentNode==oHtml);//HEAD节点的父节点是BODY节点，返回true
alert(oBody.parentNode==oHtml);//BODY节点的父节点是BODY节点，返回true
alert(oBody.previousSibling==oHead);//BODY节点的上一个兄弟节点是HEAD节点，返回true
alert(oHead.nextSibling==oBody);//HEAD节点的下一个兄弟节点是BODY节点，返回true
alert(oHead.ownerDocument==document);//返回一个节点的根元素(Document),HEAD节点是否指向该文档，返回true
通过上面的学习我们已经了解遍历节点的最基本的方式， 也学会了如何找到某一个节点的兄弟节点及它的子节点。
复杂的节点遍历
在上面的学习中我们好像没有遇到过大的阻碍，下面我们以一个“导航条”为实例：
