Is it possible to make a search by querySelectorAll()
using multiple unrelated conditions? If yes, how? And, how to specify whether those are AND or OR criteria?
For example:
How to find all forms, ps and legends with a single querySelectorAll()
call? Possible?
Is it possible to make a search by
querySelectorAll
using multiple unrelated conditions?
Yes, because querySelectorAll
accepts full CSS selectors, and CSS has the concept of selector groups, which lets you specify more than one unrelated selector. For instance:
var list = document.querySelectorAll("form, p, legend");
...will return a list containing any element that is a form
or p
or legend
.
CSS also has the other concept: Restricting based on more criteria. You just combine multiple aspects of a selector. For instance:
var list = document.querySelectorAll("div.foo");
...will return a list of all div
elements that also (and) have the class foo
, ignoring other div
elements.
You can, of course, combine them:
var list = document.querySelectorAll("div.foo, p.bar, div legend");
...which means "Include any div
element that also has the foo
class, any p
element that also has the bar
class, and any legend
element that's also inside a div
."