Menu
var arr = [].slice.call(document.querySelectorAll("a[href*='pricing']"));
Returns an array with length 6.
var arr = [].slice.call(document.querySelectorAll("a[href*='tarification']"));
Also produces an array of length 6.
The context is a website with either English or French pages. Either of the two versions or arr will return 6 results on a given page while the other will produce an empty array.
I would like to dynamically account for this. So regardless if the user is on a French or English page I know that one or the other versions will return 6 elements. I could write an if() statement. But is there a neater, shorter way? I tried the following:
var arr = [].slice.call(document.querySelectorAll("a[href*='(tarification|pricing)']"));
But that also returned an empty array.
253
The querySelectorAll() method in HTML is used to return a collection of an element's child elements that match a specified CSS selector(s), as a static NodeList object. The NodeList object represents a collection of nodes. The nodes can be accessed by index numbers.
The querySelector() method returns the first element that matches a CSS selector. To return all matches (not only the first), use the querySelectorAll() instead.
About the differences, there is an important one in the results between querySelectorAll and getElementsByClassName : the return value is different. querySelectorAll will return a static collection, while getElementsByClassName returns a live collection.
It's about css selectors, not regular expressions:
var arr = [].slice.call(document.querySelectorAll("a[href*='tarification'], a[href*='pricing']"));
The following selects all links with pricing or tarification in their href:
a[href*='tarification'], a[href*='pricing']
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
