jQuery中的siblings()效果,用javascript如何实现
PHP中文网
PHP中文网 2017-04-10 17:30:46
0
4
743

如何用javascript实现jQuery中siblings()的效果

PHP中文网
PHP中文网

认证高级PHP讲师

membalas semua(4)
洪涛
        var third = document.querySelectorAll('.third')[0];
        
        function siblings(elem){
            var ret = [],
                elem = elem.nextSibling;
                
            for(; elem; elem = elem.nextSibling){
                if(elem.nodeType == 1){
                    ret.push(elem);
                }
            }
            return ret;
        }
        console.log(siblings(third));
Peter_Zhu

javaScript,有nextSibling,previousSibling,找下一个节点,上一个节点。nextElementSibling,previousElementSibling,找下一个元素节点,上一个元素节点。n如果你要获取所有的siblings,那么就遍历。
比如ul下的li

var get_ul = document.querySelector('ul'),
    get_lis = get_ul.getElementsByTagName('li'),
    sib_eles = [];

var getSiblings = function(element) {
    for(var i=0;i<get_lis.length;++i) {
        if(get_lis[i] === element) {
            continue;
        }
        sib_eles.push(get_lis[i]);
    }
    return sib_eles;
}
   
阿神
var a = document.querySelector("li"),
    siblings = function( n, elem ) {
        var matched = [];

        for ( ; n; n = n.nextSibling ) {
            if ( n.nodeType === 1 && n !== elem ) {
                matched.push( n );
            }
        }

        return matched;
    },
    brother = siblings( a.parentNode.firstChild , a );
    
console.info( brother )

siblings()是jQuery源码

刘奇

JSLite 中 $(select).siblings 实现看起来要比 jQuery 源码容易懂一点

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan