JQuery：不要在孩子中搜索答案

【问题标题】：JQuery: Don't search within childrenJQuery：不要在孩子中搜索
【发布时间】：2013-04-27 20:11:37
【问题描述】：

假设我不想找到所有具有data-view 属性的元素，但我可以找到具有data-view 的元素，它们是其他data-view 元素的父元素。我不希望孩子们在搜索中，我想要父母。

$('[data-view]').each(function() {});

使用以下 HTML：

<body>
   <div data-view="app">
       <div data-view="hello1">
       </div>
   </div>
   <div data-view="job">

   </div>
</body>

它应该只返回app 和job 而不是hello1。我在使用 .not 选择器时没有运气，它会停止选择任何 [data-view] 元素。

有什么建议吗？

【问题讨论】：

标签： javascript jquery data-binding

【解决方案1】：

试试：

var target_attr = "[data-view]";
$(target_attr).filter(function () {
    return !$(this).find(target_attr).length;
}).each(function () {
    // Whatever
});

演示： http://jsfiddle.net/gEVyk/1/

这将找到所有具有data-view 属性且有0 个后代具有相同属性的元素。在你的情况下，那是 hello1 和 job。

如果你确定他们只是<div>s，你应该使用div[data-view]。

这将找到所有具有 0 个具有相同属性的 parents 属性的元素：

var target_attr = "[data-view]";
$(target_attr).filter(function () {
    return !$(this).parents(target_attr).length;
}).each(function () {
    // Whatever
});

演示： http://jsfiddle.net/ue9w9/1/

在你的情况下，那是 app 和 job。

【讨论】：

我让它与return $(this).find(target_attr).length; 一起工作，而不是否定版本。谢谢。
@Daniel 好吧，你的问题首先令人困惑：“但可能有一些元素具有 data-view 是其他 data-view 元素的父元素，我不想拥有这些元素在我的搜索中。”但是你说：“它应该只返回app 和job 而不是hello1。”但根据第一件事，它应该只返回hello1 和job。你应该更好地解释你想要哪些 - 没有相同后代的元素，或者没有相同祖先的元素 - 它们是完全不同的两个东西。
啊，抱歉。重读之后，确实是一头雾水。我只是为了它而更新它，但你的方法仍然有效。
@Daniel 没问题 :) 所以从技术上讲，在这种情况下，您只需要 app 元素，对吧？因为它是唯一的父母。所以在那种情况下，你是对的，在我的第一个例子中你不想要!
我想要app 元素和job 元素。问题纯粹在于不抓取同一选择器的子元素。

【解决方案2】：

怎么样

$('[data-view]:not([data-view] [data-view])').each(function() {});

http://jsfiddle.net/p5P8X/

【讨论】：

【解决方案3】：

试试$("body").children("[data-view]")。 .children() 只会查看所选元素的直接后代。

【讨论】：

这不适用于所有情况。OP 给出了一个示例，其中元素是 body 的子级。但情况可能并非如此。
是的 - 重新阅读问题后，它似乎未定义，Ian 的答案将更好地匹配这个问题。

【解决方案4】：

这应该可以解决问题：

$('[data-view]:not([data-view] [data-view])').each(function() { ... });

【讨论】：