DOM 脚本编程中的兄弟节点

兄弟节点之间可以通过 previousSibling 和 nextSibling 属性访问同一级别上的不同子节点。这个兄弟节点是元素还是文本节点在现代浏览器上运行是怎么样的呢?

除IE外的浏览器是将换行符作为内容的文本节点(nodeType为3)。而元素的话,nodeType为1。下面是查找它们的实用方法:

lastSibling:function(node){
    var tempObj = node.parentNode.lastChild;
    while(tempObj.nodeType!=1 && tempObj.previousSibling!=null)
    {
        tempObj=tempObj.previousSibling;
    }
    return (tempObj.nodeType==1)?tempObj:false;
}

这是《深入浅出JavaScript》书中DOMhelp库中lastSibling方法的源码。与 mootools 库中实现源码差不多:

'last-child': function(){
    var element = this;
    while ((element = element.nextSibling)){
        if (element.nodeType == 1) return false;
    }
    return true;
}

这是在 Mootools 1.2.4 源码中的 last-child() 方法。

IE浏览器会忽略HTML代码换行。也就是说,IE是不管HTML代码是否换行,包括最新IE 8的版本在内。而别的 web 浏览器与之等同的是不换行的HTML代码格式。如下所示:

<ul id="ul_container"><li><a href="xxx.htm">xxx</a></li><li><a href="yyy.htm">yyy</a></li><li><a href="zzz.htm">zzz</a></li></ul>

不过平时一般都不会这么写HTML。

posted on 2009-10-31 17:07  豆豆の爸爸  阅读(458)  评论(0编辑  收藏  举报