ある要素から指定するセレクタ―に一致するか判定
ある要素から指定するセレクタ―に一致するか判定するには、element.matches
メソッドを使用します。
- ※ IE8以下は対応していません。
- ※ IE9~11を含む古いブラウザはベンダープレフィックス付きで実装されています。
構文
var result = element.matches(selectrString);
引数
引数名 | 型 | 説明 |
---|---|---|
selectrString 必須 |
string | 判定するセレクタ―文字列 |
戻り値
見つかった(一致)場合はtrue、見つからなかった場合はfalseを返します。
サンプルコード
JavaScript
var sampleElement = document.getElementById('sample'),
result = sampleElement.matches('.foo');
if (result) {
alert('一致');
} else {
alert('不一致');
}
古いブラウザへの対応
古いブラウザは次のようにポリフィルを用意することで対応可能です。
JavaScript
if (!Element.prototype.matches) {
Element.prototype.matches = (function() {
return Element.prototype.matchesSelector ||
Element.prototype.mozMatchesSelector ||
Element.prototype.msMatchesSelector ||
Element.prototype.oMatchesSelector ||
Element.prototype.webkitMatchesSelector ||
function(selector) {
var matches = (this.document || this.ownerDocument).querySelectorAll(selector);
var i = matches.length;
while (--i >= 0 && matches.item(i) !== this) {}
return i > -1;
};
})();
}