javascript - 通过 Javascript 更改 CSS 对我来说在 IE8 中不起作用

Question

我有一小段代码正在运行，以根据页面上发生的事件打开和关闭一些 DIV 标记。这段代码如下:

function toggleBack() {
    var list = document.getElementsByClassName('innerContentForEmailCapture');
    var list2 = document.getElementsByClassName('mpRight');
    var list3 = document.getElementsByClassName('mpBtns');
    try {
        for (var i = 0; i < list.length; i++) {
            list.item(i).style.display = 'none';
        }
        for (var ii = 0; ii < list2.length; ii++) {
            list.item(ii).style.display = 'block';
        }
        for (var iii = 0; iii < list3.length; iii++) {
            list.item(iii).style.display = 'block';
        }
    } catch(err) {
        alert(err);
    }
}

请注意，这段代码在调用时完全符合我的要求，处理 ie8 时除外。使用此代码时，我收到一条错误消息，指出:

类型错误:对象不支持此属性或方法

我不完全确定我在这里做错了什么。这个想法是将显示为 none 用于类为“innerContentForEmailCapture”的任何 DIV，并将显示为类为“mpRight”和“的任何 DIV 的block mpBtns”。

有没有更简单的方法？一种允许该行为在 ie8 中起作用的方法？

Answer 1

问题出在你身上

document.getElementsByClassName 

IE8 不支持此功能。你最好使用

document.querySelectorAll

所以你会:

document.querySelectorAll('.innerContentForEmailCapture')
document.querySelectorAll('.mpBtns')
document.querySelectorAll('.mpRight')

或者，如果您需要使用 getElementsByClassName，您可以使用一些 polyfill，例如 this