0 
 <html>
   <head>
     <script>
       window.onload = function(){

         var input = document.getElementsByTagName("input");

         for(var i = 0; i < input.length; i++){

           document.body.removeChild(input[i]);

         }

       }
     </script>
  </head>
  <body>
    <input></input>
   <input></input>
    <input></input>
  </body>
</html>

我希望通过使用 for 循环中的方法将输入元素全部删除removeChild，但似乎第三个输入元素（索引为 2）没有被删除。

为什么？

4

3 回答 3

2

我知道这很疯狂，但你可以倒过来解决它：小提琴

window.onload = function(){
var input = document.getElementsByTagName("input");
    for(var i = input.length-1; i>=0; i--){
        document.body.removeChild(input.item(i));
    }
}

我的帐户也摆弄

于 2013-07-03T14:01:30.863 回答
1

input是一个活动节点集合（ aNodeList或 an HTMLCollection）。通过删除您正在修改集合的元素。这就像在迭代数组时从数组中删除或添加。

您可以先将集合转换为数组（添加或删除节点时数组不会更改）：

var input = [].slice.call(document.getElementsByTagName("input"));

或以相反的顺序遍历集合：

for(var i = input.length - 1; i > -1; i--)

但似乎第三个输入元素（索引为 2）没有被删除。为什么？

让我们遍历循环（要点是迭代）：

  1. input.length = 3, i = 0. 第一个输入元素被删除。
  2. input.length = 2, i = 1. 最初的第三个输入元素被删除。
  3. input.length = 1, i = 2. 循环停止，因为条件不满足。

第二个input元素没有从文档中删除，它被跳过了。在第二次迭代中，0由于第一个元素被删除，第二个元素位于索引处。

于 2013-07-03T14:02:36.563 回答
0

每次循环执行时，它都会将 i 加 1，并从输入数组中删除一个元素。在第三次迭代中，它尝试删除仅包含 1 个项目的集合中的索引 2。

改变一段时间会“解决”这个问题

    while( input.length > 0 ){
        document.body.removeChild(input[0]);
   }
于 2013-07-03T14:08:25.277 回答