querySelectorAll跟getElementByTagName两种方法都可以用来获取页面中的元素
但是querySelectorAll获取的是静态的 也就是你页面本来就有的内容
而getElementByTagName获取的是动态的 可以由JS后期添加的内容
<ul> <li></li> <li></li> <li></li> </ul> <script> var ul = document.getElementsByTagName('ul') var lis = ul.getElementsByTagName('li') for (var i = 0;i<lis.length;i++) { var li = document.createElement('li') ul.appendChild(li) } </script>此时 因为getElementByTagName是动态获取ul 中的 li 会造成lis.length 无限增加 相当于 本来有3个li 只需要循环3次 循环结束 我循环一次 给ul添加li 于是有了4个li 需要循环4次退出循环 然后就会造成死循环
<ul> <li></li> <li></li> <li></li> </ul> <script> var ul = document.querySelector('ul') var lis = document.querySelectorAll('li') for (var i = 0;i<lis.length;i++) { var li = document.createElement('li') ul.appendChild(li) } </script>此时 querySelectorAll是静态获取 ul 中的li 于是此时的li.length一直是3 所以循环会循环3次退出
