getElementsByClassName 和 IE8：对象不支持此属性或方法 [重复]答案

【问题标题】：getElementsByClassName & IE8: Object doesn't support this property or method [duplicate]getElementsByClassName 和 IE8：对象不支持此属性或方法 [重复]
【发布时间】：2012-03-23 01:29:10
【问题描述】：

我知道IE8 不支持“getElementsByClassName”。你知道我可以用什么代替吗？我因错误而烦人

“对象不支持此属性或方法”。

HTML 代码是：

function sumar() {
var elems = document.getElementsByClassName('verdana14 toAdd');
var myLength = elems.length;
total = 0;
for (var i = 0; i < myLength; ++i) {
   if (elems[i].value!="") {
       total += parseInt(elems[i].value,10);
       }
    }

var promedio = total/myLength;
parseFloat(document.getElementById('promediocal').value = promedio.toFixed(2));
}

这是调用 javascript 函数的输入文本：

<input name='AE_EA_1_BIV_003_2' type='text' class='verdana14 toAdd' id='AE_EA_1_BIV_003_2' style='width:50px' onChange='sumar()'/>
<input name='AE_EA_1_BIV_003_3' type='text' class='verdana14 toAdd' id='AE_EA_1_BIV_003_3' style='width:50px' onChange='sumar()'/>
<input name='AE_EA_1_BIV_003_4' type='text' class='verdana14 toAdd' id='AE_EA_1_BIV_003_4' style='width:50px' onChange='sumar()'/>

【问题讨论】：

jQuery 有一个很棒的 CSS 选择器实现（包括类名搜索）：jquery.com
我也喜欢 jQuery，对于运行 IE8 的东西，它几乎肯定不会是令人望而却步的开销，但对于纯原生 javascript，querySelectorAll() 是最好的答案，只要名称空间不在图片中。

标签： javascript internet-explorer-8

【解决方案1】：

使用 jQuery，或从 getElementsByTag 过滤结果

【讨论】：

【解决方案2】：

你可以自己写。比如：

function GEBCN(cn){
    if(document.getElementsByClassName) // Returns NodeList here
        return document.getElementsByClassName(cn);

    cn = cn.replace(/ *$/, '');

    if(document.querySelectorAll) // Returns NodeList here
        return document.querySelectorAll((' ' + cn).replace(/ +/g, '.'));

    cn = cn.replace(/^ */, '');

    var classes = cn.split(/ +/), clength = classes.length;
    var els = document.getElementsByTagName('*'), elength = els.length;
    var results = [];
    var i, j, match;

    for(i = 0; i < elength; i++){
        match = true;
        for(j = clength; j--;)
            if(!RegExp(' ' + classes[j] + ' ').test(' ' + els[i].className + ' '))
                match = false;
        if(match)
            results.push(els[i]);
    }

    // Returns Array here
    return results;
}

会很好用，但如果你愿意，你可以写一个更快的。然后你就可以改变了：

document.getElementsByClassName('verdana14 toAdd');

收件人：

GEBCN('verdana14 toAdd');

【讨论】：

您需要更改cn.replace(' ', '.')，因为它只会替换第一个空格。您需要一个global 正则表达式，它也将相邻的空格视为一个。与您的cn.split(/ /) 相同，它应该是全局的，并测试相邻空格，并且它应该包含其他空格字符，例如制表符，所以\s 可能更好。
@amnotiam 谢谢，是的，我被 PHP 弄糊涂了，忘记了哪个替换了所有没有 g 修饰符的所有内容。我故意从\s 切换到` `，因为我认为不会使用制表符或换行符调用该函数。我对其进行了修改以修剪尾随空格。
是的，可能是关于标签/新行的安全赌注。
@amnotiam cn.split 上也不需要g 标志。它不会做任何事情，因为 split 无论如何都会找到所有匹配项。
是的，你说得对。

【解决方案3】：

使用document.querySelectorAll('.verdana14.toAdd')。

另见我的相关@987654321@。

【讨论】：

这将提供最简单的解决方案，但您应该使用querySelectorAll 来获取多个元素。
谢谢，我已将 qs 替换为 qsA，从而更正了我的错字。
我下载了 jQuery 并使用了 document.querySelectorAll('.verdana14.toAdd');
如果使用原生浏览器方式（document.querySelectorAll()），则不需要jQuery即可使用，反之亦然。

【解决方案4】：

IE8 不支持getElementsByClassName 方法。

您应该使用document.querySelectorAll('.classname')（在 IE8+ 中工作）或实现该功能的库 - 例如：

jQuery
Moo Tools
DOJO
YUI
Prototype

...其中...

querySelectorAll 支持：

http://www.quirksmode.org/dom/w3c_core.html#t13

getElementsByClassName支持：

http://www.quirksmode.org/dom/w3c_core.html#t11

【讨论】：

【解决方案5】：

您可以尝试使用 jquery，因为它具有替代类选择器来通过类名获取元素。 $(".testclass").each... 它会按类名为您提供所需的元素

【讨论】：