Question

基本上我想做这样的事情：

<my-root-element id="myID">
    <button id="some-id">Occupy The Universe</button>
    <div id="x" class="class-1 class-1a">
        <div id="y" class="class-3">
        <p>Rabit hole</p>
    </div>
</div>
</my-root-element>

let rootEl = document.getElementById(myID);
rootEl.addEventListener('click', function(e) {
    if (e.target && e.target.matches('button#some-id')) {
        console.log("Did something nasty");
    } else if (e.target && e.target.matches('.class-1.class-1a') || e.target && e.target.matches('.class-1.class-1a > .class-3')) {
        console.log("Was there");
    }
});

在我看来，类嵌套无效，但也许我缺少了什么？我想在一个IF中做到这一点，因为两者都是一样的。似乎querySelector支持嵌套类，但无法弄清楚如何在其中实现。

Answer 1

看起来#x的简单样式有所帮助。 ||部分不再需要。

> * {
    pointer-events: none;
}

是否有可能event.target.matches（'。class-1.class-2'> .class-3'）

1 个答案: