querySelector和querySelectorAll大家都很熟悉了,但要验证一个页面元素是否符合给定CSS,在以前只有自己写
let c, p = elt.parentNode;
return blackIDs.some(css => {
if (!css.length) return !1;
c = p.querySelectorAll(css);
return c.length && blackIDs.some.call(c, e => e.isSameNode(elt));
});
(blackIDs黑名单数组;elt为待验证元素)
现在有了MatchesSelector API不用这么麻烦了,各浏览器略微有点不同:
chrome: webkitMatchesSelector
firefox: mozMatchesSelector
opera: oMatchesSelectorIE : msMatchesSelector
这里给出统一的办法:
let x = document.documentElement;
HTMLElement.prototype.matchesSelector = x.webkitMatchesSelector ||
x.mozMatchesSelector || x.oMatchesSelector || x.msMatchesSelector;
现在开头的代码可一行实现:
return blackIDs.some(s => elt.matchesSelector(s));