虽然网上有中文翻译但是还是直接看英文有感觉。getElementByTagName 与 querySelectorAll在节点查询时候在效率上区别。
Conclusion
The real reason why getElementsByTagName() is faster than querySelectorAll() is because of the difference between live and static NodeList objects. Although I’m sure there are way to optimize this, doing no upfront work for a live NodeList will generally always be faster than doing all of the work to create a static NodeList. Determining which method to use is highly dependent on what you’re trying to do. If you’re just searching for elements by tag name and you don’t need a snapshot, then getElementsByTagName() should be used; if you do need a snapshot of results or you’re doing a more complex CSS query, then querySelectorAll() should be used.
参考:
http://mzhou.me/?p=95119
http://www.w3.org/TR/selectors-api/#queryselectorall
http://www.nczonline.net/blog/2010/09/28/why-is-getelementsbytagname-faster-that-queryselectorall/
http://jsperf.com/queryselectorall-vs-getelementsbytagname
分享到:
相关推荐
2. **使用`querySelectorAll`代替**:`querySelectorAll`在所有现代浏览器以及IE8及以上版本中都可用,它可以替代`getElementsByTagName`,并且返回的是NodeList,而不是Live NodeList,这可能避免一些问题。...
- 避免使用`getElementByTagName()`和`getElementsByTagName()`遍历整个文档。 - 使用`querySelector()`和`querySelectorAll()`代替,因为它们可以使用CSS选择器,通常更快。 - 使用事件委托:在父元素上添加事件...
现代浏览器支持getElementsByClassName, querySelector以及querySelectorAll(可以解析CSS语法)。然而,老版本的浏览器可能只提供getElementById以及getElementByTagName。在最坏的情况下,jQuery的Sizzle引擎必须...
DOM API提供了多种方法和属性,例如`document.getElementById()`、`document.querySelector()`和`document.querySelectorAll()`,它们分别用于通过ID、CSS选择器和类名查找元素。还有`getElementByTagName()`和`...
8. **DOM遍历和选择器API**:如querySelector、querySelectorAll、getElementByTagName、getElementById等,以及CSS选择器的使用。 9. **BOM(浏览器对象模型)**:处理浏览器窗口、导航、历史记录、定时器等功能。...
- C: `document.getElementByTagName('file')[0]`:`getElementByTagName` 不接受自定义标签名,且语法错误。 - D: `document.getElementById('file')`:这是正确的写法。 - **正确答案**:D #### 9. 如何实现在...
`getElementByTagName()`返回的NodeList集合可以像数组一样通过索引访问,例如`document.getElementsByTagName("p")[0]`将获取第一个`<p>`元素。 6. **通过属性选择获取**: `getElementsByClassName()`方法根据...
从IE8开始支持,因此在IE6/7环境下,实际可用的只有getElementByTagName。 - IE6/7不支持getElementsByTagName('*')会返回非元素节点。要么不用'*',要么自定义函数进行过滤。 - IE8下的querySelectorAll对属性选择...
3. 使用更高效的DOM API,比如`children`代替`childNodes`,`childElementCount`代替`childNodes.length`,以及`querySelectorAll`代替`getElementByTagName`等。 4. 注意重绘和重排的影响。重排(reflow)和重绘...