如何实现浏览器兼容版的element.children---DOM操作

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---DOM操作)