首页  >  文章  >  web前端  >  如何在 JavaScript 中按类检索元素,特别是为了兼容 IE?

如何在 JavaScript 中按类检索元素,特别是为了兼容 IE?

Susan Sarandon
Susan Sarandon原创
2024-11-05 21:41:02814浏览

How Can I Retrieve Elements by Class in JavaScript, Especially for IE Compatibility?

在 JavaScript 中按类检索元素,包括 IE 兼容性

根据元素的类获取元素数组是 JavaScript 中的一项常见任务。但是,对于本身不支持 document.getElementsByClassName() 的浏览器(例如 IE),需要另一种方法。

一个流行的解决方案是 Jonathan Snook 的函数。该函数使用正则表达式来测试每个元素的 className 属性。然而,在 IE 中,它会抛出错误,指出“对象不支持此属性或方法。”

关键是要意识到 getElementsByClassName() 不是文档对象的方法。相反,应该直接在要搜索元素的节点上调用它:

function getElementsByClassName(node, classname) {
    var a = [];
    var re = new RegExp('(^| )' + classname + '( |$)');
    var els = node.getElementsByTagName("*");
    for (var i = 0, j = els.length; i < j; i++) {
        if (re.test(els[i].className)) a.push(els[i]);
    }
    return a;
}

var tabs = getElementsByClassName(document.body, 'tab');

对于 IE8 ,更简洁的方法是填充 getElementsByClassName() 函数:

if (!document.getElementsByClassName) {
    document.getElementsByClassName = function (className) {
        return this.querySelectorAll("." + className);
    };
    Element.prototype.getElementsByClassName = document.getElementsByClassName;
}

var tabs = document.getElementsByClassName('tab');

通过这些技术,您可以按类检索元素,确保与 IE 和其他浏览器的兼容性。

以上是如何在 JavaScript 中按类检索元素,特别是为了兼容 IE?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn