JS中getElementByClassName的坑 JS中getElementByClassName的坑

今天写东西练手的时候发现，使用getElementByClassName的时候，如果对元素的ClassName进行修改，那么数组的长度会发生变化。废话不说先看代码。

Document - 锐客网body { height: 100%; width: 100%; }.nav-list{ position: absolute; top:0px; left:0px; width: 200px; height:100%; background: rgb(85, 85, 97); }.nav-list .nav-title { text-align: center; background:rgb(21, 21, 31); color: white; margin:0px; padding:7px; } .nav-list ul{ padding:0px; margin:0px; } .nav-list ul li{ list-style-type: none; } .nav-list ul li h3{ color:white; margin:2px; background:rgb(139, 173, 211); text-align:center; padding:6px; }.hide{ margin:0px; transition: 1s; display: none; } .on{ margin:0px; transition: 1s; }.nav-list ul li h5{ text-align: center; color: white; display: block; margin:2px; background:rgb(128, 141, 214); padding:5px; }Title subtitle 1 1 1 1 subtitle 1 2 3 4 5

具体情况就不说了，大致就是侧边栏有两个按钮，点击时绑定了事件，对应隐藏的部分会修改类名进行显示同时提示当前使用getElementByClassName获得的数组长度。