'Query-selecting elements from multiple elements, efficiently

Say you have an array of elements and you want to get all the <p> belonging to the elements in the array.
I can see two possibilities:

  1. Run Element.querySelectorAll() on each element of the array and then concatenate all the various NodeLists of <p>

  2. Run a single Document.querySelectorAll() and then filter out all <p> not belonging to any of the elements in the array

I don't have such a deep knowledge on the mechanics of query selectors to be able to make a thoughtful decision.

What is most performant, to run more queries on smaller elements or to run fewer queries on bigger elements (actually only one on the biggest of them all)?

javascriptperformancejquery-selectors


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions