是否可以阻止 jQuery.find() 在 DOM 树的某些节点下方搜索？

Question

假设以下 DOM 结构：

.grandparent
  .parent
    .child .successful
      .a
      .b
        .an-arbitrary-subtree
  .parent
    .child
      .a
      .b
        .a-different-arbitrary-subtree
  .adopted
    .child
      .a
      .b
        .another-arbitrary-subtree
          .with-different-parents
            .but-sometimes-common-css-classes .successful

如果我 $('.grandparent').find('.successful') 毫不奇怪，我会回来 [.child .successful, .but-sometimes-common-css-classes .successful]

有什么方法可以阻止 jQuery 的查找方法在 .child 节点下方遍历？也许我可以自己重新实现 $.find() 并在节点上添加一个顶级 class 来停止搜索（在本例中为 .b）

我为什么要问？ 即使我们还没有 Shadow Dom，我想创建可以包含组件的组件（由其他开发人员匿名创建) 而不用担心泄漏。聚合物还不够稳定。我更喜欢在这些组件中限定我的 jQuery 选择器的范围，但只能从子树的顶部节点限定范围，并且还没有办法将范围限制到树的深处。

Answer 1

可以使用not()方法或:not()选择器或filter()。没有一些更现实的标准来从这个例子开始工作有点基础。

$('.grandparent .a').not('.adopted .child .a').doSomething();

Answer 2

考虑使用 each()，然后从返回的列表中获取 .child 的第一个实例。类似于：

$('.parent').each(function() {
    return $(this).find('.successful').first();
});

Answer 3

您可以使用 .filter() 并检查集合中每个项目的父元素。

Answer 4

很难做到这一点。如果您想在没有附加信息的情况下合理保证效率（例如，当您不感兴趣的子树可能任意大时），那么您将不得不手动遍历 DOM.

否则，您可以拉出所有候选人并过滤掉您不想要的候选人：

$('.grandparent')
    .find('.successful')
    .filter(function() { return !$(this).closest(".child").length; })

如果你走后一条路线，请确保准确无误：

如果 .successful 个元素是 .child 个，是否要过滤掉它们本身？使用 closest 可以做到这一点，但也许您不需要这样做。
有没有可能.child出现在.grandparent上面？如果是这样，则需要增强过滤功能，使其不会拒绝所有候选匹配项。

Answer 5

如果我没理解错的话，您想要访问所有拥有自己的“.success”子元素的“.child”元素。您可以通过在“.grandparent”元素中搜索所有“.success”子元素来实现这一点，当您到达“.success”元素时，然后搜索其名为“.child”的父元素。

像这样：

$('.grandparent').find('.successful').parents("child:first");

如果这不是您所要求的，希望它能帮助您找到正确的解决方案:)

是否可以阻止 jQuery.find() 在 DOM 树的某些节点下方搜索？

Is it possible to prevent jQuery.find() from searching below certain nodes of the DOM tree?

javascript

jquery

dom

polymer