Javascript 为什么可以'；更改已定义元素的类名

我只想删除一些元素的一个类，而不需要像jQuery这样的框架。 首先，我尝试使用for（…in…）而不是将ist更改为for（var I…），但现在我发现，即使是直接选择也不起作用

使用jQuery，它工作得很好。但是。。。让我们来解释一下jQuery的功能

我的剧本：

[109] <script>
[110]   var hidden = document.getElementsByClassName('hidden');
[111]   console.log('Class "hidden" size: ' + hidden.length);
[112]   console.log(hidden[0].tagName);
[113]   console.log(hidden[1].tagName);
[114]
[115]   hidden[0].className = '';
[116]   hidden[1].className = '';
[117] </script>  

为什么我可以获取

隐藏[1]

的标记名，但不更改其类名，而是为

隐藏[0]

当我把订单改成

[115]   hidden[1].className = '';
[116]   hidden[0].className = '';

因此，

hidden[1]

在

hidden[0]

之前就起作用了

---

它看起来像

var hidden=document.getElementsByClassName（'hidden'）长度变小时，将再次运行code>。
getElementsByClassName
返回一个活动节点列表，这意味着它包含的元素会随着DOM的更改而更改。从该集中的元素中删除相关类名，该元素将自动从该集中删除

因此，您应该向后迭代元素：

for ( var i = hidden.length - 1; i > -1; i-- ) {
  hidden[ i ].className = '';
}

在第一次迭代中，集合将包含2个元素（索引为0和1）。您将从索引1处的元素中删除该类，并且该元素将从集合中删除。在下一次迭代中，集合中只剩下一个元素，但由于
i
已递减为0，因此您可以正确引用它

编辑

正如评论中所建议的，您还可以反复修改
隐藏[0]
：

while ( hidden.length ) {
  hidden[ 0 ].className = '';
}

getElementsByClassName
返回一个活动节点列表，这意味着它包含的元素随着DOM的变化而变化。从该集中的元素中删除相关类名，该元素将自动从该集中删除

因此，您应该向后迭代元素：

for ( var i = hidden.length - 1; i > -1; i-- ) {
  hidden[ i ].className = '';
}

在第一次迭代中，集合将包含2个元素（索引为0和1）。您将从索引1处的元素中删除该类，并且该元素将从集合中删除。在下一次迭代中，集合中只剩下一个元素，但由于
i
已递减为0，因此您可以正确引用它

编辑

正如评论中所建议的，您还可以反复修改
隐藏[0]
：

while ( hidden.length ) {
  hidden[ 0 ].className = '';
}

您是否也可以重复应用
隐藏[0]到第一个元素，直到没有元素为止？@JosephYoung-Yep这也行。我在答案中添加了一个这种方法的示例。谢谢。谢谢你的解释！但是当我只使用一次
document.getElementsByClassName（'hidden'）
并将值写入变量时，为什么会发生这种情况？@dede-因为您只是将对活动节点列表的引用分配给变量。分配没有任何特殊功能。您是否可以重复应用
hidden[0]。className=''到第一个元素，直到没有元素为止？@JosephYoung-Yep这也行。我在答案中添加了一个这种方法的示例。谢谢。谢谢你的解释！但是当我只使用一次
document.getElementsByClassName（'hidden'）
并将值写入变量时，为什么会发生这种情况？@dede-因为您只是将对活动节点列表的引用分配给变量。这项作业没有什么特别之处。