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

最新推荐文章于 2025-08-05 10:10:59 发布

原创最新推荐文章于 2025-08-05 10:10:59 发布 · 1.9k 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#children

收录于

dom编程专栏收录该内容

10 篇文章

订阅专栏

本文介绍了一种在Internet Explorer 9及其更低版本中兼容获取元素子节点的方法。通过覆盖原生的'children'属性，使得在不支持该属性的浏览器中也能正确返回子节点列表。

element.children这个获取节点子节点的方法支持ie9及以上版本，为了能够兼容低版本的ie，可参考一下的代码实现兼容，具体的参考资料是MDN上的实现方法：

// Overwrites native 'children' prototype.
// Adds Document & DocumentFragment support for IE9 & Safari.
// Returns array instead of HTMLCollection.
(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);