获取文档的所有元素，但ID为“main-nav”的元素除外

Question

我想从侧面做一个汉堡菜单，打开时背景应该模糊，应该禁用悬停效果。 如何让身体中的所有元素都使用id main-nav。 我需要使用javascript来获取它，而不需要像jquery那样的库。 这是我认为它应该是但它不起作用：

document.querySelector('*:not(#main-nav)')

提前致谢

Answer 1

要选择多个元素，请使用querySelectorAll ，而不是querySelector ：

var items = document.querySelectorAll('*:not(#main-nav)')

但你不太可能真的需要所有这些元素。 您可以使用类或其他属性来优化您的选择并避免使用* 。

也许你只想选择容器。

我通常的解决方案是在要模糊的元素上显示div（可能是整个窗口），并使用带有后备的backdrop-filter CSS过滤器，只为不支持它的浏览器选择背景。

Answer 2

由于您选择了多个节点，因此应使用querySelectorAll而不是querySelector ：

document.querySelectorAll('*:not(#main-nav)');