2018-10-12 16:00:59 -04:00
---
title: HTML DOM querySelector()
localeTitle: HTML DOM querySelector ()
---
2019-04-15 22:03:01 +03:00
Метод объекта Document `querySelector()` возвращает `первый` элемент в документе, который соответствует указанному селектору или группе селекторов. Если совпадений не найдено, возвращается null.
2018-10-12 16:00:59 -04:00
**Содержание HTML:**
```html
< div id = "id-example" > < / div >
< div class = "class-example" > < / div >
< a > element-example< / a >
```
**Содержание JavaScript:**
```javascript
2019-04-15 22:03:01 +03:00
document.querySelector("#id -example"); // Возвращает элемент с id "id-example"
document.querySelector(".class-example"); // Возвращает элемент с классом "class-example"
document.querySelector("a"); // Возвращает элемент "a"
2018-10-12 16:00:59 -04:00
```
2019-04-15 22:03:01 +03:00
Заметим, что `querySelector()` возвращает первый соответствующий элемент, чтобы вернуть все совпадения, используйте метод querySelectorAll ().
2018-10-12 16:00:59 -04:00
```html
< div id = "example" > First< / div >
< div id = "example" > Second< / div >
```
```javascript
2019-04-15 22:03:01 +03:00
document.querySelector("#example "); // Возвращает только элемент с содержанием 'First'
2018-10-12 16:00:59 -04:00
```
#### Дополнительная информация:
2019-04-15 22:03:01 +03:00
[MDN - document.querySelector () ](https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector )