使用普通Javascript [复制]选择除类名称的特定元素以外的所有元素

Question

这个问题在这里已有答案：

• How do I detect a click outside an element? 76回答

我正在实施一个简单的网站，其中有一个切换边栏。当我点击页面上的某个地方（侧边栏除外）时，我想隐藏侧边栏。所以我认为我应该获取页面上的所有元素，除了具有侧栏类的元素。用普通的javascript有没有办法做到这一点？ JQuery有：not（）为此选择，但我试图不使用JQuery ...... :(

Answer 1

JQuery有：not（）为此选择

它实际上是CSS，虽然jQuery扩展它允许所有选择器（CSS的:not只允许在simple selector内的:not）。你的是一个简单的选择器，所以你可以使用:not：

var list = document.querySelectorAll(":not(.sidebar)");

然而：

当我点击页面上的某个地方（侧边栏除外）时，我想隐藏侧边栏。

我不会通过在每个元素上设置事件处理程序来实现它。相反，我在document上设置了一个处理程序，然后在去往文档的路上检查事件是否通过侧栏传递，例如：

document.addEventListener("click", function(e) {
    if (e.target.closest(".sidebar")) {
        return; // The click passed through the sidebar
    }
    // close the sidebar
});

它使用Element#closest，它存在于所有现代浏览器中，并且可以填充为过时的浏览器。