Javascript 在vanilla JS中，如何使用带有2个伪选择器的querySelectorAll？

我正在以vanilla JS的形式编写一些jQuery—看起来是这样的：

$('.main-container').children('.module:has(a)').not('#promo');

我所尝试的：

document.querySelectorAll('.main-container .module:has(a):not(#promo)');

但是在一个语句中使用两个伪选择器让我很反感。仅使用

：not（#promo）

选择器可以正常工作：

document.querySelectorAll('.main-container .module:not(#promo)');

---

但是当我尝试添加

：has（a）

时，事情就崩溃了。我遗漏了什么？

重新排列选择器，如下所示：

var modules = document.querySelectorAll('.main .module:not(#exclude)');

然后对

包含（a）

查看演示，让我知道HTML是否正确，因为它没有发布

演示 应排除索引2、5和9

var modules=Array.from（document.queryselectoral（'.main.module:not（#exclude'））；
var hasA=modules.filter（函数（模块、索引、hasA）{
设a=module.querySelector（'a'）；
返回模块。包含（a）；
});
map（函数（模块、索引、hasA）{
module.insertAdjacentText（'beforeend'，'INCLUDED'）；
返回console.log（`module${index}:${module.textContent}`）；
});
。作为控制台包装器{
宽度：60%；
左缘：40%；
最小高度：100%；
}













没有链接
按如下方式重新排列选择器：

var modules = document.querySelectorAll('.main .module:not(#exclude)');

然后对
包含（a）

查看演示，让我知道HTML是否正确，因为它没有发布

演示
应排除索引2、5和9


var modules=Array.from（document.queryselectoral（'.main.module:not（#exclude'））；
var hasA=modules.filter（函数（模块、索引、hasA）{
设a=module.querySelector（'a'）；
返回模块。包含（a）；
});
map（函数（模块、索引、hasA）{
module.insertAdjacentText（'beforeend'，'INCLUDED'）；
返回console.log（`module${index}:${module.textContent}`）；
});
。作为控制台包装器{
宽度：60%；
左缘：40%；
最小高度：100%；
}













没有链接
查看浏览器支持。
has（）
选择器不受任何浏览器支持。jQuery可能会专门处理
has（）
选择器以使其工作。
has
在CSS/querySelector中还不受支持。因此，您可以跳过它，然后查看每个
forEach
结果，以查看哪个孩子的
a
。是的，这是更多的工作，但您必须模仿jQuery所做的。从jQuery文档中：
：has（）是jQuery的扩展，而不是CSS规范的一部分，
如果我等到forEach处理
：has（a）
，这不会在循环中丢弃索引吗？查看浏览器支持。
has（）
选择器不受任何浏览器支持。jQuery可能会专门处理
has（）
选择器以使其工作。
has
在CSS/querySelector中还不受支持。因此，您可以跳过它，然后查看每个
forEach
结果，以查看哪个孩子的
a
。是的，这是更多的工作，但您必须模仿jQuery所做的。从jQuery文档中：
：has（）是jQuery的扩展，而不是CSS规范的一部分，
如果我等到forEach处理
：has（a）
，这不会在循环中丢弃索引吗？应该选择包含链接的模块，不是链接本身。@asw1984没有。父级不能fix@asw1984很高兴看到HTML。请参阅更新的答案。应选择包含链接的模块，而不是链接本身。@asw1984 nothing a.parent无法选择fix@asw1984很高兴看到HTML。请参阅更新的答案。