Javascript document.getElementsByClassName（）工作不正常？

我在特定xpath上使用evaluate（）查找所有节点，然后添加类以突出显示这些节点，但当我尝试删除这些类以取消高亮显示这些节点时，它只是取消高亮显示的一半。即使循环也只运行了一半的时间

展示。有谁能告诉我为什么它只亮了一半？ HTML部分：

<div id="div1">abcdefghi</div>
<div id="div4">abcdefghi</div>
<div id="div2">abcdefghi</div>
<div id="div3">abcdefghi</div>

---

ele变量在选择了类highlight_csspath_的情况下保持对DOM元素的引用。因此，随着循环的进行，ele的长度也会减小

比如说,

ele的起始长度为4，i=0

当您从第一个元素中移除类时，长度变为3，下一次迭代时i变为1，因此它引用初始数组的第三个元素

初始数组=[A，B，C，D]和i=0

从A中删除类

数组更新为[B，C，D]//因为现在只有这些元素包含类

现在i=1，即[C]//跳过[B]

因此，在每个迭代中，1个元素被跳过，因此一半的元素被更新

检查小提琴中的溶液

---

我已将ele转换为一个数组，因此它不引用DOM

ele变量在选择了类highlight_csspath_的情况下保留对DOM元素的引用。因此，随着循环的进行，ele的长度也会减小

比如说,

ele的起始长度为4，i=0

当您从第一个元素中移除类时，长度变为3，下一次迭代时i变为1，因此它引用初始数组的第三个元素

初始数组=[A，B，C，D]和i=0

从A中删除类

数组更新为[B，C，D]//因为现在只有这些元素包含类

现在i=1，即[C]//跳过[B]

因此，在每个迭代中，1个元素被跳过，因此一半的元素被更新

检查小提琴中的溶液

---

我已经将ele转换为数组，这样它就不会引用DOM

Javascript文档。getElementsByClassName返回一个活动集合，这意味着DOM中的更改会反映在集合中。 因此，对于每个迭代，列表的大小减少1，因此ele.length不是常数。因此循环迭代两次而不是4次。可以将其替换为for each循环

for(var element : ele){
   ele.classList.remove("highlight_csspath_chosen");
}

---

有关live collection的更多信息，请参阅

Javascript文档。getElementsByClassName返回live collection，这意味着DOM中的更改将反映在集合中。 因此，对于每个迭代，列表的大小减少1，因此ele.length不是常数。因此循环迭代两次而不是4次。可以将其替换为for each循环

for(var element : ele){
   ele.classList.remove("highlight_csspath_chosen");
}

有关live collection的更多信息，请参阅

var ele = document.getElementsByClassName("highlight_csspath_chosen"); 
ele = Array.prototype.slice.call(ele,0);

for(var element : ele){
   ele.classList.remove("highlight_csspath_chosen");
}