Элемент: метод matches()

Базовая Широко доступна

Эта функция хорошо зарекомендовала себя и работает на многих устройствах и версиях браузеров. Она доступна в браузерах с июля 2015 года.

Метод matches() интерфейса Element проверяет, будет ли элемент выбран указанным CSS-селектором.

Синтаксис

matches(selectors)

Параметры

selectors: Строка, содержащая допустимые CSS-селекторы для проверки на соответствие Element.

Возвращаемое значение

true , если Element соответствует selectors. В противном случае, false.

Исключения

SyntaxError DOMException: Выбрасывается, если selectors не может быть разобран как список CSS-селекторов.

Примеры

HTML

<ul id="birds">
  <li>Orange-winged parrot</li>
  <li class="endangered">Philippine eagle</li>
  <li>Great white pelican</li>
</ul>

JavaScript

const birds = document.querySelectorAll("li");

for (const bird of birds) {
  if (bird.matches(".endangered")) {
    console.log(`The ${bird.textContent} is endangered!`);
  }
}

Это выведет в консоль "Орландо Филиппин находится под угрозой исчезновения!", так как элемент имеет атрибут class со значением endangered.

Спецификации

Спецификация
DOM # ref-for-dom-element-matches①

Совместимость с браузерами

	Десктопные					Мобильные
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari на iOS	Samsung Internet	WebView Android
`matches`	334	151212–79	3444 3.6 ["Перед Firefox 4, недопустимые строки селекторов приводили к возвращению false вместо исключения.", "См. ошибку 1119718 для удаления."]	211511.5–15	85	3318	3444 4 См. ошибку 1119718 для удаления.	211411.5–14	84.2	2.01.0	4.4≤37

См. также

Модуль CSS-селекторов
Другие методы Element принимающие селекторы: Element.querySelector(), Element.querySelectorAll() и element.closest().

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Element/matches