querySelectorAll

Метод querySelectorAll() возвращает все элементы, удовлетворяющие CSS-селектору, указаному в скобках.

Читайте статью: CSS: селекторы.

Метод querySelectorAll() - один из самых часто используемых и полезных методов при работе с DOM.

Следующий пример возвращает в переменную elements все элементы LI, которые являются последними потомками (:last-child) в списках UL:

<ul>
	<li>Этот</li>
	<li>тест</li>
</ul>
<ul>
	<li>полностью</li>
	<li>пройден</li>
</ul>
<script>
var elements = document.querySelectorAll('ul > li:last-child');

for (var i = 0; i < elements.length; i++) {
alert( elements[i].innerHTML ); // "тест", "пройден"
}
</script>

querySelector

Метод querySelector() работает также, как querySelectorAll(), но возвращает только один первый элемент соответствующие запросу.

В нашем примере результат работы инструкций будут одинаковы.

elem.querySelector(ul > li:last-child);
elem.querySelectorAll(ul > li:last-child)[0];