queryselector和getElementby区别

getElementsBy 包含动态添加的内容
querySelector 不包含动态添加内容

<ul>
 <li></li>
 <li></li>
 <li></li>
 <li></li>
 <li></li>
</ul>
<script>
var ul = document.getElementsByTagName('ul')[0];
var lis = ul.getElementsByTagName('li');
var lis2 = ul.querySelectorAll('li');
// 动态添加li
for(var i=0; i<5; i++){
  ul.appendChild(document.createElement('li'))
}
console.log("getElementsBy 包含动态 - ",lis.length) // getElementsBy 包含动态添加的内容 - 10
console.log("querySelector 不包含动态 - ",lis2.length) //querySelector 不包含动态添加内容 - 5
</script>