可以对存储的选择器对象执行额外的 jquery 选择吗？

Question

示例数据：

<input class="foo" special="yes" value="1" new="yes">
<input class="foo" special="no" value="2" new="yes">
<input class="foo" value="3" new="red">
<input class="foo" special="yes" value="4">
<input class="foo" value="5" new="yes">

现在 jquery:

var the_inputs = $("input.foo");

...将为我提供所有输入的 jquery 对象。

我还可以这样做：

var the_special_inputs = $("input.foo[special]");

... 只返回具有特殊属性的输入。

更进一步，我可以获得具有特殊属性的输入，其中它们还具有“yes”的新属性：

var the_special_inputs = $("input.foo[special][new='yes']");

但是如果我只想使用“the_inputs”并创建 var the_special_inputs 而无需做另一个选择器？换句话说，如果我有存储的 var:

var the_inputs = $("input.foo");

...有没有办法在该存储的 var 上编写一个额外的选择器，这会给我与 $("input.foo[special]"); 相同的结果 或其他类似上面的内容，但只是使用之前存储的 the_inputs ？

我尝试过一些不起作用的事情：

$(the_inputs+"[special][new='yes']");
$("[special]",the_inputs);

可能吗？

Answer 1

使用 jQuery 的 .filter() 方法。

var the_inputs = $("input.foo");
var the_special_inputs = the_inputs.filter("[special][new='yes']");

这将创建一个新集合，将原始集合简化为与您传递的选择器匹配的集合，而无需进行额外的 DOM 选择。

还有另一种方法称为.not()，它保留那些与选择器不匹配的内容。

Answer 2

您也可以使用 jQuery find() 方法，但过滤器要好得多：

var the_inputs = $("input.foo");
var the_special_inputs = the_inputs.find("[special][new='yes']");