HTML DOMのmatches（）メソッド
❮要素オブジェクト例
要素がCSSセレクターと一致するかどうかを判別します。
var element = document.getElementById("myElement");
if (element.matches(".container")) {
element.innerHTML = "This element matches the \".container\" CSS selector";
} else {
element.innerHTML = "This element does not match the \".container\" CSS selector";
}
定義と使用法
このmatches()メソッドは、要素が特定のCSSセレクターと一致するかどうかを示すブール値を返します。
ヒント：すべてのCSSセレクターのリストについては、CSSセレクターリファレンスを参照してください。
ブラウザのサポート
表の数字は、このメソッドを完全にサポートする最初のブラウザバージョンを示しています。
| Method | |||||
|---|---|---|---|---|---|
| matches() | 33.0 | 18.0 | 34.0 | 7.0 | 21.0 |
構文
element.matches(selectors)
パラメータ値
| Parameter | Description |
|---|---|
| selectors |
Required. Specifies one or more CSS selectors to match the element. These are used to select HTML elements based on their id, classes, types, attributes, values of attributes, etc. For multiple selectors, separate each selector with a comma. The returned element depends on which element that is first found in the document (See "More Examples"). Tip: For a list of all CSS Selectors, look at our CSS Selectors Reference. |
技術的な詳細
| 戻り値： |
要素がCSSセレクターによって一致できるかどうかを示すブール値：
|
|---|
その他の例
例
要素が複数のセレクターの1つと一致するかどうかを確認します。
var element = document.getElementById("myElement");
if (element.matches(".container, .wrapper")) {
element.innerHTML = "This element matches either the \".container\" CSS selector or the \".wrapper\" selector.";
} else {
element.innerHTML = "This element does not match any of the selectors.";
}
関連ページ
JavaScriptリファレンス：element.closest（）メソッド。
❮要素オブジェクト