Question

我正在使用dojo.query，它在内部使用CSS3选择器来识别要检索的元素。

我想要找到的是带有标签“foo”的所有元素，但只有最外面的元素（即允许将一个“foo”嵌入到另一个“foo”中，我想忽略它们）。外部元素可以出现在文档的任何级别，几乎嵌套在任何其他元素中。

当然，dojo.query('foo')会返回所有foo元素，包括嵌套的元素（我不想要）。

我的下一次尝试是dojo.query('foo:not(foo foo)')，但这不会返回任何结果（因为后代选择器不是“简单选择器”，因此:not不支持。）

我知道通常用于此类事情的CSS级解决方案是定义两个规则（foo和foo foo），以便可以区别对待嵌套元素。但是在这种情况下这不起作用（因为这只是一个选择）。（它也让我觉得在真正的CSS中也不整齐，因为嵌套元素仍然会得到第一条应用于它们的规则，因此无法使用浏览器或父默认值来解决第一条规则覆盖的问题。）

如果有帮助，至少在一个foo进入另一个foo的那一刻它必须是一个直接的孩子，尽管它们最终可以嵌套到任意级别。（即'foo＆gt; foo'也会成功匹配所有嵌套的foo元素，但不幸的是，它仍然与我想要的相反。）

编辑：我现在正在使用的解决方法如下，虽然我仍然希望有更优雅的东西（以及更多的祖先安全，以防可以间接嵌套）：

dojo.query('foo').forEach(function(foo) {
    if (foo.parentNode.localName == 'foo') { return; }
    // ...
});

Answer 1

如果它永远是直系后代，那么你可以做

dojo.query("foo").filter(function(item) {
    return (item.parentNode.nodeName.toLowerCase() !== "foo");
})

CSS3选择器为“not descendent”或“find outermost”？

1 个答案: