Given i have a sample page that looks like this:
<!DOCTYPE html> <html> <body> <h1 aria-controls="name1">heading</h1> <p aria-controls="name2">paragraph</p> <span aria-controls="name1">span</span> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> </body> </html>
How would i use jQuery to select the (2) elements with their aria-controls
attribute set to name1
? (ignoring the fact that the element types are different).
Thank you!
Another way to get aria values is to reference the properties directly: For your instance, you could do something like this: let firstAnchorTag = document. getElementsByTagName('a')[0]; // I don't know your situation but I recommend adding an id to this element, or making this an iterable array.
To get an element by aria-label, pass a selector that targets the specific aria-label value to the querySelector() method, e.g. document. querySelector('[aria-label="Close"]') . The querySelector method returns the first element in the document that matches the provided selector.
The #id Selector The jQuery #id selector selects an HTML element based on the element id attribute. Following is a simple syntax of a #id selector: $(document).
The attribute selector
[aria-controls="name1"]
should work.
Docs: http://api.jquery.com/attribute-equals-selector/
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