javascript - 更改类名问题(javascript 和 IE)

Question

以下 javascript 代码无法正常工作。 (我使用的是 IE9，无法使用其他浏览器或 JQuery):

var elems = document.getElementsByClassName("EditableTextBox");
for (var i = 0; i < elems.length; i++) {                
    elems[i].className = "Zero";
}

发生的情况是，只有一些类名为“EditableTextBox”的元素被更改为类名“Zero”，许多元素仍然使用类名“EditableTextBox”。没有其他代码可能导致此问题；这段代码是我在屏幕刷新前执行的最后一段代码。

我认为问题在于 .getElementsByClassName 没有找到所有正确的元素，但是:

var elems = document.getElementsByClassName("EditableTextBox");
for (var i = 0; i < elems.length; i++) {                
    elems[i].value = "test";
}

此代码确实将所有正确元素的值更改为“test”，因此 .getElementsByClassName 确实正确找到了所有元素。

我不明白是什么导致了这里的问题。我的解决方法如下，但是在这里有更多经验的任何人都可以解释为什么第一段代码不起作用吗？谢谢。

如果有人感兴趣，我的解决方法:

var elems = document.getElementsByTagName("input");
for (var i = 0; i < elems.length; i++) {
    if (elems[i].className == "EditableTextBox")
       elems[i].className = "Zero";

谢谢。

Answer 1

getElementsByClassName 似乎返回一个事件集，因此当您更改任何项目的类别时，该集会立即更新，并且会跳过其他项目。改为反向循环:

for (var i = elems.length - 1; i >= 0; --i) {                
    elems[i].className = "Zero";
}