首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >javascript document.getElementsByClassName与IE的兼容性

javascript document.getElementsByClassName与IE的兼容性
EN

Stack Overflow用户
提问于 2011-09-14 11:29:37
回答 7查看 86.9K关注 0票数 76

检索具有特定类的元素数组的最佳方法是什么?

我会使用document.getElementsByClassName,但IE不支持它。

所以我尝试了Jonathan Snook's solution

代码语言:javascript
复制
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 = document.getElementsByClassName(document.body,'tab');

...but IE仍然说:

对象不支持此属性或方法

有什么想法,更好的方法,bug修复吗?

我不喜欢使用任何涉及jQuery或其他“笨重的javascript”的解决方案。

更新:

我让它起作用了!

作为@joe mentioned,该函数不是document的方法。

因此,工作代码将如下所示:

代码语言:javascript
复制
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');

...Also 如果您只需要IE8+ support,则可以执行以下操作:

代码语言:javascript
复制
if(!document.getElementsByClassName) {
    document.getElementsByClassName = function(className) {
        return this.querySelectorAll("." + className);
    };
    Element.prototype.getElementsByClassName = document.getElementsByClassName;
}

就像平常一样使用它:

代码语言:javascript
复制
var tabs = document.getElementsByClassName('tab');
EN

回答 7

Stack Overflow用户

回答已采纳

发布于 2011-09-14 11:32:57

它不是一种文档方法:

代码语言:javascript
复制
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;
}

tabs = getElementsByClassName(document.body,'tab');  // no document
票数 56
EN

Stack Overflow用户

发布于 2011-12-12 18:01:42

您可以为较旧的浏览器创建该函数

代码语言:javascript
复制
if (typeof document.getElementsByClassName!='function') {
    document.getElementsByClassName = function() {
        var elms = document.getElementsByTagName('*');
        var ei = new Array();
        for (i=0;i<elms.length;i++) {
            if (elms[i].getAttribute('class')) {
                ecl = elms[i].getAttribute('class').split(' ');
                for (j=0;j<ecl.length;j++) {
                    if (ecl[j].toLowerCase() == arguments[0].toLowerCase()) {
                        ei.push(elms[i]);
                    }
                }
            } else if (elms[i].className) {
                ecl = elms[i].className.split(' ');
                for (j=0;j<ecl.length;j++) {
                    if (ecl[j].toLowerCase() == arguments[0].toLowerCase()) {
                        ei.push(elms[i]);
                    }
                }
            }
        }
        return ei;
    }
}
票数 18
EN

Stack Overflow用户

发布于 2011-10-31 23:52:05

代码语言:javascript
复制
function getElementsByClassName(className) {
if (document.getElementsByClassName) { 
  return document.getElementsByClassName(className); }
else { return document.querySelectorAll('.' + className); } }

我很确定这与列昂尼德的函数是一样的,但它在可能的情况下使用了document.getElementsByClassName

票数 14
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/7410949

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档