元素:matches() 方法

matches()Element 接口的一个方法,用于测试该元素是否会被指定的 CSS 选择器 选中。

语法

js
matches(selectors)

参数

selectors

包含有效 CSS 选择器 的字符串,用于测试 Element

返回值

如果 Element 匹配 selectors,则返回 true。否则返回 false

异常

SyntaxError DOMException

如果 selectors 无法解析为 CSS 选择器列表,则抛出此异常。

示例

HTML

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

JavaScript

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

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

这会将“菲律宾鹰濒临灭绝!”记录到控制台,因为该元素确实有一个值为 endangeredclass 属性。

规范

规范
DOM 标准
# ref-for-dom-element-matches①

浏览器兼容性

BCD 表格仅在启用 JavaScript 的浏览器中加载。

另请参阅