過濾選擇

要過濾選擇，你可以使用 .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");