jquery选择没有嵌套在孩子身上的孩子

Question

我有一个jQuery选择器的问题.

假设我有以下html (...)代表未定义数量的html标签.

(...)
<div class="container">
  (...)
    <div class="subContainer">
      (...)
        <div class="container">
          (...)
            <div class="subContainer"/>
          (...)
        </div>
       (...)
     </div>
   (...)
</div>
(...)

假设我有一个调用的javascript变量container指向第一个div(带有类容器).我想要一个jquery来选择第一个子容器而不是嵌套的子容器.如果我使用$(".subContainer", container);我会得到他们两个.

我试过用了

$(".subContainer:not(.container .subContainer)", container);

但这会返回一个空集.有解决方案吗

谢谢.

Answer 1

你可以使用direct child选择器:

$("> .subContainer", container);

如果container是引用顶级.container元素的jQuery对象,您还可以使用children方法:

container.children('.subContainer');

或find与first方法:

container.find('.subContainer').first();

Answer 2

基于Jquery:获取一个类的所有元素,这些元素不是具有相同类名的元素的后代？我开发了以下解决方案.谢谢大家.

$.fn.findButNotNested = function(selector, notInSelector) {
    var origElement = $(this);
    return origElement.find(selector).filter(function() {
        return origElement[0] == $(this).closest(notInSelector)[0];
    });
};