javascript中查找节点的方法

文档中的每一个元素都是一个对象。利用DOM提供的方法能得到任何一个对象。在DOM里有许多不同类型的节点，也有很多类型的DOM节点包含在其他类型的节点；不过在查找节点之前，应该先了解有哪些类型的节点。下面是一张简单的dom结构图，含元素节点、文本节点和属性节点，如图：

2、一般来说不需要为文档里的每一个元素都定义一个id值，DOM提供了另一个方法来获取哪些没有id属性的对象 ——getElementsByTagName（）该方法返回一个对象数组，每个对象分别对应着文档里有着给定标签的一个元素。例子：<script> var aLi=document.getElementsByTagName('li'); alert(aLi.length);</script>

4、解决getElementsByClass鲍伊酷雪Name的兼容性getElementsByClassName方法非常有用，不过这只有比较新的浏览器才支持它，这就需要使吹涡皋陕用已有的DOM方法来实现自己的getElementsByClassName，在新老浏览器中都适用： function getByClass(oParent,sClass){ if(oParent.getElementsByClassName){ return oParent.getElementsByClassName(sClass); } else{ var aEle=oParent.getElementsByTagName('*'); var aTmp=[]; var i=0; for(i=0;i<aEle.length;i++){ if(aEle[i].className==sClass){ aTmp.push(aEle[i]); } } return aTmp; } }这个getByClass函数有两个参数，第一个参数oParent指DOM树中的搜索起点，第二个参数sClass就是要搜索的类名。如果浏览器支持getElementsByClassName，就返回getElementsByClassName；否则就遍历所有标签，查找到有相应类名的元素。下面来看getByClass函数的运用： var oDiv1=document.getElementById('ul1'); var apple=getByClass(oDiv1,'apple'); alert(apple.length);//3 for(var i=0;i<apple.length;i++){ apple[i].style.color='darkslategray';//修改类名为apple的字体颜色 }效果如图：可以在低版本的浏览器中做测试

2、lastChild：获取已知节点的最后一个子节点lastChild跟firstChild一样可以递归使用，也可以someNode.lastC茑霁酌绡hild.lastChild.lastChild.lastChild……；当然也可以和firstChild交替使用啊someNode.lastChild.firstChild.lastChild.firstChild.lastChild.firstChild……例子（html代码在第一步）:var oUl=document.getElementById('ul1');alert(oUl.lastChild.nodeName);注意：元素中的空白被视作文本，而文本被视作文本节点，所以在ul关闭标签前如果有空格，结果会是：nodeName=#text。在本文第一步中的html代码关闭标签前都是存在空格的，如果要测试这步，要清除空格！

3、chil蟠校盯昂dNodes：获取已知节点的子节点集合可以使用 length 属性来确定子节点的数量，然后遍历所有的子节点并提取所需要的信息；例子：获取body元素的子节点 var oBody=document.body.childNodes; var oTmp=[]; for(var i=0;i<oBody.length;i++){ oTmp=oTmp+oBody[i].nodeName+'……'; //这里用省略号将各个nodeName分隔 } alert(oTmp);注意：元素中的空格被视为文本，而文本被视为节点事实上：someNode.childNodes[0]与someNode.firstChild是相等的；someNode.childNodes[length-1]与someNode.lastChildChild是相等的。具体测试案例这里不再赘述

2、someNode.nextSibling：返回在同层级中指定节点之后紧跟的节点，被返回的节点以Node对象的形式返回；如果没有someNode.nextSibling 节点，则返回值为 null。例子： var oBa=document.getElementById('banana'); var oLl=oBa.nextSibling; oLl.style.color='black'; alert(oLl.innerHTML);注意：在本文第一步中的html代码关闭标签前都是存在空格的，如果要测试这步，要清除空格！

JavaScript查找属性节点

1、getAttribute 获取属性getAttribute与此前介绍的那些方法有所不同，getAttribute方法不属于document对象，所以不能通过document对象调用；它只能通过元素节点对象调用。例子： var oUl=document.getElementById('ul1'); var aLi=oUl.getElementsByTagName('li'); for(var i=0;i<aLi.length;i++){ alert(aLi[i].getAttribute('title')); }依次弹出li的title值，对应没有title属性的li元素相对应的弹出null，这里只截一张图说明