过滤选择

要过滤选择，你可以使用 .filter() 方法。

在选择上调用该方法并返回新选择。如果过滤器与元素匹配，则将其添加到返回的选择中，否则将忽略它。如果没有匹配的元素，则返回空选择。

HTML

这是我们将使用的 HTML。

<ul>
    <li class="zero">Zero</li>
    <li class="one">One</li>
    <li class="two">Two</li>
    <li class="three">Three</li>
</ul>

选择

使用选择器进行过滤是筛选选择的更简单方法之一。

$("li").filter(":even").css("color", "green"); // Color even elements green
$("li").filter(".one").css("font-weight", "bold"); // Make ".one" bold

功能

如果无法使用选择器，则使用函数过滤选择很有用。

为选择中的每个元素调用该函数。如果它返回 true 值，则元素将被添加到返回的选择中。

var selection = $("li").filter(function (index, element) {
    // "index" is the position of the element
    // "element" is the same as "this"
    return $(this).hasClass("two");
});
selection.css("color", "green"); // ".two" will be colored green

分子

你可以按 DOM 元素进行过滤。如果 DOM 元素在选择中，那么它们将包含在返回的选择中。

var three = document.getElementsByClassName("three");
$("li").filter(three).css("color", "green");

选择

你还可以通过其他选择过滤选择。如果一个元素都在两个选择中，那么它将包含在返回的选择中。

var elems = $(".one, .three");
$("li").filter(elems).css("color", "green");