<ul>
<li>aaa</li>
<li>ddd</li>
<li>ccc</li>
</ul>
//demo1
var ul = document.getElementsByTagName('ul')[0],
lis = ul.getElementsByTagName("li");
for(var i = 0; i < lis.length ; i++){
ul.appendChild(document.createElement("li"));
}
console.log( lis.length); //无法打印,前面for循环变成了死循环
//demo2
var ul = document.querySelectorAll('ul')[0],
lis = ul.querySelectorAll("li");
for(var i = 0; i < lis.length ; i++){
ul.appendChild(document.createElement("li"));
}
console.log( lis.length); //3
区别在于第一段代码 造成了死循环,getElementBy获取的时候动态集合,当往节点里面追加的时候,length又变长了,无穷无尽
querySelector 是个静态的,只是获取当前状态的节点