为什么更改对象列表中的类名会从列表中删除项目答案

【问题标题】：why changing classname in a list of object removes itens from the list为什么更改对象列表中的类名会从列表中删除项目
【发布时间】：2016-08-06 05:44:11
【问题描述】：

您会看到只有 2 个 td 对象丢失了 clasNname。为什么变量“many”在每个className="" 处丢失一个itens？谁能帮我？谢谢。

    <!DOCTYPE html>
    <html>
    <head>
        <title>Why?</title>
        <style>
            .f{background:lightblue;}
            .g{background:lightcoral;}
        </style>
    </head>
    <body>
        <table id="t" style="border:1px solid black">
            <tr>
                <td class="f">1</td>
                <td class="f">2</td>
                <td class="f">3</td>
                <td class="f">4</td>
            </tr>
        </table>

        <script>
            many = document.getElementById("t").getElementsByClassName("f");
            document.write("initial length of many="+many.length+"<br>");
            for (var x = 0; x < many.length; x++) {
                many[x].className='';
                document.write("loop x="+x+" many.length="+many.length+"<br>");
            }
            document.write("final length of many="+many.length+"<br>");
        </script>
    </body>
</html>

【问题讨论】：

因为getElementsByClassName() 返回一个live 元素集合——基本上是DOM 的一个子视图。对 DOM 的后续更改确实会影响此类视图。

标签： javascript html classname

【解决方案1】：

getElememtsByClassName() 方法返回一个活动的 NodeList，因此，如果您删除您搜索的类名，那些不再具有该类名的元素将立即从该 NodeList 中删除many 变量。

【讨论】：