jQuery中的siblings()效果,用javascript如何实现
PHP中文网
PHP中文网 2017-04-10 17:30:46
[JavaScript讨论组]

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

PHP中文网
PHP中文网

认证高级PHP讲师

全部回复(4)
PHP中文网
        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));
天蓬老师

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 源码容易懂一点

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号