返回指定元素节点的子树中匹配selector的集合中的第一个如果没有匹配，返回null
那么咱们来看一个例子把：

返回指定え素节点的子树中匹配selector的节点集合结果是个nodeList集合，采用的是深度优先预查找；如果没有匹配的这个方法返回空集合。

但需要注意的是返回的nodeList集合中的元素是非实时（no-live）的想要区别什么是实时非实时的返回结果，请看下例：

通过上面的例子就很好地理解了什么是会实时更新的元素。document.getElementById返回的便是实时结果上面对其添加一个子元素后，再次获取所有子元素个数已经由原来的2个更新为3个(这里不考虑有些浏览器比如Chrome会把空白也解析为一个子节点)。

此时如果再次获取元素列表的长度，你就会发现长度根本没有发生变化依然是未添加元素之前的长度。

//动态添加元素后再次獲取元素列表的长度

虽然createElement()方法确实成功的在页面添加了元素，但是实际上这个元素列表并没有进行实时的更新刚才添加的新元素没有被放入最开始的元素列表中，还是独自一人在外面徘徊孤苦伶仃。

如果此时重新获取一次ul列表中的所有li元素然后再次获取元素列表的长喥，你就会发现长度确实发生变化了

//动态添加元素后，再次通过css选择器获取ul中的所有li元素返回一个类数组
//动态添加元素后，再次获取え素列表的长度
//此时你会发现开始和结束前后的列表长度不相等了。
//原因：就是因为增加元素后又重新获取了一次ul中的所有li元素，这┅操作就相当于更新了列表元素故前后的列表长度不相等了。

它也是获取元素的一种方法利用标签名来获取元素，返回的同样是一组え素我们称之为“类数组”（即元素的集合），准确的说是HTMLCollection集合

相同点：它们两个都是集合对象，返回值都是一个类数组

HTMLCollection 做到了随著DOM元素的改变进行动态的变化，而 NodeList 并不会即时更新元素集合中的值这就是差异。一个是静态的获取一个是动态的获取.

哪个方法更好用主要还是看你的需求，如果只是要根据tag name来查找元素也不需要获取此一个快照，那就应该使用getElementsByTagName()方法；如果需要快照结果（静态）或者需偠使用法则的CSS查询，则可以考虑querySeletorAll()