Метод querySelector позволяет получить элемент (тег) страницы по произвольному селектору CSS.

Чтобы получить элемент с заданным id, нужно написать #его_id, с заданным классом - .его_класс и так далее - любой селектор.

С полученным элементом можно будет производить различные манипуляции: менять его текст, атрибуты, css стили и так далее.

См. также методы getElementById, getElementsByTagName, getElementsByClassName, querySelectorAll, которые тоже позволяют получить элементы страницы.

См. также этот и этот уроки из учебника JavaScript для более полного понимания.

Синтаксис

document.querySelector(селектор);

Примеры

Пример

Давайте получим абзац #elem и поменяем ему текст с помощью innerHTML:

<p id="elem">Абзац</p>
var elem = document.querySelector('#elem');
elem.innerHTML = '!!!';

HTML код станет выглядеть так:

<p id="elem">!!!</p>

Пример

Давайте получим абзац с классом elem и поменяем ему текст с помощью innerHTML:

<p id="elem">Абзац</p>
var elem = document.querySelector('.elem');
elem.innerHTML = '!!!';

HTML код станет выглядеть так:

<p id="elem">!!!</p>