getElementById和querySelector方法的区别是什么？

Answer 1

getElementByXXX 获取的是动态集合，querySelecto或querySelectorAll获取的是静态集合。

<ul id="ul">
    <li>1</li>
    <li>2</li>
    <li>3</li>
</ul>

//demo1
var ul = document.getElementById('ul'),
     lis = document.getElementsByTagName("li");
for(var i = 0; i < lis.length ; i++){
     ul.appendChild(document.createElement("li"));
}
console.log(lis.length);  //会卡死浏览器，因为li的长度一直在变大

//demo2
var ul = document.getElementById('ul'),
    lis = document.querySelectorAll("li");
for(var i = 0; i < lis.length ; i++){
     ul.appendChild(document.createElement("li"));
}
console.log(lis.length);  //3