两种获取元素所有兄弟节点的方法比较

下面是一个常规的获取兄弟节点的办法。

function siblings(elm) {
    var a = [];
    var p = elm.parentNode.children;
    for(var i =0,pl= p.length;i<pl;i++) {
        if(p[i] !== elm) a.push(p[i]);
    }
    return a;
}

思路:先获取此元素的父节点的所有子节点,因为所有子节点也包括此元素自己,所以要从结果中去掉自己。

还有另外一种看起来比较奇特的方法,是jQuery里面获取兄弟节点的源码:

function sibling( elem ) {
        var r = [];
        var n = elem.parentNode.firstChild;
        for ( ; n; n = n.nextSibling ) {
            if ( n.nodeType === 1 && n !== elem ) {
                r.push( n );
            }
        }

        return r;
    }

思路:先找到此元素的父节点的第一个子节点,然后循环查找此节点的下一个兄弟节点,一直到查找完毕。

我很奇怪为什么jQuery会使用这个方法,难道这个方法比第一个方法效率更高?

经过我初步测试——1500多个li,上面两个方法效率几乎无差别,都是几毫秒内就获取成功了。测试环境是chrome与firefox。

如果有获取所有兄弟节点的需求,可以使用以上任一方法。

不过,我想问个钻牛角尖的问题。如果在极端的情况下,比如10000个同级元素,上面的两个方法到底谁效率高呢?求高人解答

原: http://www.jo2.org/archives/350.htm.

posted on 2012-07-04 15:33  十年灯  阅读(495)  评论(1编辑  收藏  举报