Question

我试图改进我的vanilla JavaScript，并试图编写一个删除类的函数＆＃34; active＆＃34;从列表项和相应的div。我的代码如下：

var elems = document.getElementsByClassName("active");
console.log(elems.length);

for (var i = 0; i < elems.length; i += 1) {
  elems[i].classList.remove("active");
  console.log("end", elems.length);
}

当我第一次登录elems.length时，我得到2.第一次通过循环elems.length现在是1.这显然会导致代码功能出现问题。

为什么使用classList.remove导致elems的长度发生变化？如何在不使用jQuery的情况下获得正确的功能？

Answer 1

getElementsByClassName()返回实时收藏集;它将随着更少（或更多）元素匹配而改变。

最简单的方法是反向删除：

var elems = document.getElementsByClassName("active");

for (var i = elems.length - 1; i >= 0; i--) {
  elems[i].classList.remove("active");
}

删除类时，getElementsByClassName（）数组的长度会发生变化

1 个答案: