Menu
Using Prototype JS library, I want to select all child link elements (A tags) regardless of whether their parent is: H1, H2, H3, H4, or H5 (etc) with a simple CSS Selector Rule (as opposed to further JS, like looping etc).
So the simple, but long way, to do this is:
$('page').select('h1 > a, h2 > a, h3 > a, h4 > a, h5 > a')
I guess I'm looking for a wild-card property, like h*, that doesn't exist.
Maybe the above example is the way to go, but I'm hoping there is a simpler, more concise and efficient way to do this.
Tips appreciated.
599
To select all level 1 headings we would use the h1 selector. Element selectors will apply CSS to every instance of that element in your document.
In CSS, selectors are patterns used to select the element(s) you want to style, but as you can tell from the title above, selectors are also useful in javascript and below are some examples on how to use them.
The * selector selects all elements. The * selector can also select all elements inside another element (See "More Examples").
The above selector is based on the type of the element: it selects all elements of type "h1." This kind of selector is called type selector .
As per Fabien Ménager comment to the original question, it looks like there isn't a simple CSS Selector I can use other than what I have already.
$('page').select('h1 > a, h2 > a, h3 > a, h4 > a, h5 > a')
While there are other options if I want to be programmatic about it, or empty JQuery (which isn't an option for me) I am specifically looking for a CSS rule.
Thank you to everyone who tried to help.
94
Using jQuery:
$(":header a")
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
