Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

queryselectorAll - find an element with more than one matching class

Tags:

javascript

Using the JS queryselectorall method is it possible to select an elemnent of a particular tag name with 2 matching classes.

E.g. I have an element

<a class="classOne classTwo"></a>

using queryselectorall I can select on one classname:

document.querySelectorAll("a.classOne");

how could this be extended so I can find all a tags with classOne AND classTwo?

document.querySelectorAll("a.classOne classTwo"); as expected doesn't seem to work

Thanks in advance

like image 579
user502014 Avatar asked Jul 06 '11 14:07

user502014


People also ask

How do you find an element with multiple classes?

Use the getElementsByClassName method to get elements by multiple class names, e.g. document. getElementsByClassName('box green') . The method returns an array-like object containing all the elements that have all of the given class names.

What does the querySelectorAll () method do?

Document.querySelectorAll() The Document method querySelectorAll() returns a static (not live) NodeList representing a list of the document's elements that match the specified group of selectors.

Can you use forEach on querySelectorAll?

Can you use forEach on querySelectorAll? Since nodeList selected by querySelectorAll has an array-like structure so you can directly apply forEach method with it and pass element as the first element in the callback function.


2 Answers

The same way you would in CSS:

document.querySelectorAll("a.classOne.classTwo"); 

example: http://jsfiddle.net/gcf6w/6/

like image 115
Niklas Avatar answered Oct 12 '22 22:10

Niklas


Just add a dot..

document.querySelectorAll("a.classOne.classTwo")   
like image 20
Lime Avatar answered Oct 12 '22 22:10

Lime