Summary

Returns a list of the elements within the document (using depth-first pre-order traversal of the document's nodes) that match the specified group of selectors. The object returned is a NodeList.

Syntax

elementList = document.querySelectorAll(selectors);

where

The returned NodeList will contain all the elements in the document that are matched by any of the specified selectors. If the selectors string contains a CSS pseudo-element, the returned elementList will be empty.

Example

This example returns a list of all div elements within the document with a class of either "note" or "alert":

var matches = document.querySelectorAll("div.note, div.alert");

Notes

Returns a non-live NodeList of all the matching element nodes.

Throws a SYNTAX_ERR exception if the specified group of selectors is invalid.

querySelectorAll() was introduced in the WebApps API.

WebKit browsers have a bug: when the selectors string contains a CSS pseudo-element, the returned elementList is not empty but contains the <html> element.

The string argument passed to querySelectorAll must follow the CSS syntax. See document.querySelector for concrete examples.

Specifications

Specification Status Comment
Selectors API Level 2
The definition of 'document.querySelector()' in that specification.
Working Draft  
Selectors API Level 1
The definition of 'document.querySelector()' in that specification.
Recommendation Initial definition

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 1 3.5 9
8[1]
10 3.2
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 2.1 (Yes) 9 10.0 3.2

[1] Internet Explorer 8 only supported CSS2 selectors.

See also

Document Tags and Contributors

Last updated by: Sebastianz,
Hide Sidebar