NodeList NameNodeMap HTMLCollection引发的死循环

NodeList NameNodeMap HTMLCollection类型,都是动态的集合,每当文档结构发生变化的时候,它们都会得到更新

var divs = document.getElementsByTagName("div");
var i, div;

for(i=0; i < divs.length; i++){
    div = document.createElement("div");
    document.body.appendChild(div);
    console.log(i);
}

程序一开始会取得所有<div>元素的HTMLCollection,当循环进行一次时,由于添加了一个<div>.所以当程序执行divs.length时,NodeList类会动态更新!导致程序进入了死循环

解决方法:

var len = divs.length;
for(i=0; i < len; i++){
    //pass
}

所以注意开发中要尽量少的操作NodeList等动态集合.

参考: JavaScript 高级程序设计(第3版) 第10章 10.2.4