美文网首页
如何实现浏览器兼容版的element.children---DO

如何实现浏览器兼容版的element.children---DO

作者: 苏敏 | 来源:发表于2017-11-06 10:53 被阅读3次

    dom课后作业,第一个是我自己的做法,第二个是网上看别人的,一看就是看了高级程序设计的,借鉴一下吧~

    我的做法:

    var someElement = {
        children: function(element) {
            if (element.children) {
                console.log(element.children);
            } else {
                var arr = [];
                var list = element.ChildNodes;
                for (var i = 0; i < list.length; i++) {
                    if (list[i].nodeType == 1) {
                        arr.push(list[i]);
                    }
                }
                return arr;
            }
        }
    };
    // var div = document.getElementById("test");
    // someElement.children(div);
    
    

    Object.defineProperty方式:

    (function(constructor) {
        if (constructor && constructor.prototype && constructor.prototype.children == null) {
            Object.defineProperty(constructor.prototype, 'children', {
                get: function() {
                    var i = 0,
                    node, nodes = this.childNodes,
                    children = [];
                    while (node = nodes[i++]) {
                        if (node.nodeType === 1) {
                            children.push(node);
                        }
                    }
                    return children;
                }
            });
        }
    })(window.Node || window.Element);
    

    思路是一样的,但是人家看起来就是高级一些~~

    相关文章

      网友评论

          本文标题:如何实现浏览器兼容版的element.children---DO

          本文链接:https://www.haomeiwen.com/subject/dbgkmxtx.html