Can I Put Logical Operators In Document.queryselectorall? If So, How?

Let's say I want to find all div elements and span inside p. Is it possible to get all what I want in a single `querySelectorAll' invocation? Conceptually it should be something li

Solution 1:

Yes. You can use the same logical operators allowed in CSS:

OR: chain selectors with commas

document.querySelectorAll('div, p span');
// selects divs, and spans in ps

AND: chain selectors without whitespace

document.querySelectorAll('div.myClass');
// selects divs with the class "myClass"

NOT: :not()-selector

document.querySelectorAll('div:not(.myClass)');
// selects divs that do not have the class "myClass"