javascript - 获取不在具有已知类的元素内部的元素

Question

假设您有以下 HTML 代码:

<div class="test">
    <div class="class1">
        <input type="text" data-required="true"/>
    </div>
    <input type="text" data-required="true"/>
</div>

我想从 .test 中获取所有具有 data-required 属性但不在 .class1 div 中的元素。因此，在上面的示例中，只会返回第二个输入。

我试过:


$(".test [需要数据]:not('.class1')")


但它返回两个输入，因为 :not 没有选择父元素。

这可以用一个 jQuery 选择器实现吗？

JSFIDDLE

Answer 1

一种方法:

$(".test [data-required]").filter(function() {
   return !$(this).closest('.class1').length;
}).css("background", "red");

.filter() 方法比类似意大利面条的选择器快得多，如果你不想使用 .filter()，可能你可以使用这个 long , 低效的选择器:

$(".test > [data-required], .test :not(.class1) [data-required]");