javascript - 使用matchesSelector js检查event.target.parentElement

不关心旧的浏览器回退。另外，不能使用库。

我有一个事件对象。我正在通过matchsSelector针对CSS选择器测试event.target:
event['target'].matchesSelector('css selector here');
这可行，因为:
event['target']['parentElement'].matchesSelector('css selector here');
...和:
event['target']['parentElement']['parentElement'].matchesSelector('css selector here');
我正在寻找的是一些可能的对象方法，超出了我的理解范围，我可以使用它一直检查每个parentElement是否匹配，而没有for循环。我的重点是效率。

谢谢!

最佳答案

为了防止遍历目标元素的所有父元素的冗余循环，可以通过将matchesSelector()与原始选择器和附加的上下文选择器(由空格组成)串联使用，来快速检查元素是否在与选择器匹配的元素内和目标元素的标签名称:

function getAncestorBySelector(elem, selector) {
    if (!elem.matchesSelector(selector + ' ' + elem.tagName)) {
        // If element is not inside needed element, returning immediately.
        return null;
    }

    // Loop for finding an ancestor element that matches your selector.
}