Test name | Executions per second |
---|---|
TreeWalker | 281445.7 Ops/sec |
querySelectorAll | 449552.9 Ops/sec |
<!-- article out start -->
<article>
<!-- article in start -->
<h1>Lorem ipsum</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque, nostrum.</p>
<!-- article in end -->
</article>
<!-- article out end -->
<!-- article out start -->
<article>
<!-- article in start -->
<h1>Lorem ipsum</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque, nostrum.</p>
<!-- article in end -->
</article>
<!-- article out end -->
<!-- article out start -->
<article>
<!-- article in start -->
<h1>Lorem ipsum</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque, nostrum.</p>
<!-- article in end -->
</article>
<!-- article out end -->
const treeWalker = document.createTreeWalker(
document.body,
NodeFilter.SHOW_ELEMENT,
() => node.nodeName == "H1" ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_REJECT
,
false
);
for(let element; element; element = treeWalker.nextNode()) {
element.className = 'new Class'
}
const list = document.body.querySelectorAll('h1');
for(let i = 0, len = list.length ; i < len ; i++){
list[i].className = 'new Class'
}