JavaScript querySelectorAll()和getElementsByTagName的区别

querySelectorAll()和getElementsByTagName()两者的主要区别就是返回值。前者返回的是NodeList集合，后者返回的是HTMLCollection集合。。

NodeList对象是一个节点的集合，是由Node.childNodes和document.querySelectorAll()返回的。NodeList并不是都是静态的，Node.childNodes返回的是动态的元素集合；

querySelectorAll() 返回的是一个静态集合。

HTMLCollection 返回一个时时包括所有给定标签名称的元素的HTML集合，也就是动态集合。

其中动态集合和静态集合的最大区别在于：

动态集合指的就是元素集合会随着DOM树元素的增加而增加，减少而减少；静态集合则不会受DOM树元素变化的影响。

 使用getElementsByTagName()方法我们得到的返回值就像通过对象的索引来获取，而通过querySelectorAll()方法我们得到的返回值就像通过对象的克隆来获取；所以当这个对象数据量非常大的时候，显然通过克隆这个对象所需要花费的时间是很长的。