querySelectorAll() 和 getElementBy() 方法的区别

1. querySelectorAll和getElementsBy方法均可以用在element上，可是querySelector做用于Element、nodeList、DocumentFragment时的查找范围是从整个文档开始，返回的是一个 Static Node List(对于返回的元素会判断是否在元素的子树内，将在 element 子树内的节点组成 NodeList 返回，返回的顺序根据文档顺序定义)，这一点和getElementsBy（返回的是一个 Live Node List）要须要区分开的；
2. getElementById能够接受一个不合法的id：好比<div id="my.name"></div>用document.querySelectorAll('#my.name')毫无疑问是query不到它的，querySelectorAll 所接收的参数是必须严格符合 CSS 选择符规范的。可是用document.getElementById('my.name')却能够
3. 性能上的区别：在Chrome浏览器下getElementBy系列的执行速度基本都是高于querySelectorAll，广泛观点是getElementBy的性能比querySelectorAll要好不少；
4. querySelectorAll属于 W3C 中的 Selectors API 规范 [1]。而 getElementBy系列则属于 W3C 的 DOM 规范 [2]。

整理自：https://www.zhihu.com/question/24702250