更简单的方法来限制.each()循环中的条目

Simpler way to limit entries in a .each() loop

本文关键字:循环 each 方法 更简单      更新时间:2023-09-26

我一直想知道是否有一个好的,jquery风格的方法来做以下事情:

var count = 0;    
$("p").each(function() {
    if (count >= 5)
        return false;
    $(this).toggleClass("highlight");
    count++;
});

是否有一个类似的功能,作为each()在jQuery中,将允许我设置多少项的限制,它将循环,或者这是最好的方式做的事情?

最简单的是.slice:

$("p").slice(0, 5).toggleClass("highlight");
// only <p>s from index 0 (inclusive) to 5 (exclusive)

看看slice()。这将拆分$("p")返回的数组,以便与.each()一起使用:

$("p").slice(0, 4).each(function() {
    // Do stuff
});

.slice()以起始索引和结束索引作为参数。在上面的例子中,我们从第一个数组元素(索引为0)开始,并返回索引为4的下5个元素。

您可以简单地限制所选择的元素:$("p:lt(5)").toggleClass("highlight");

对你有用吗?

$("p").each(function(index){
 if (index >4)
 {
    return false;
 }
...
});

另一种写法是使用filter:

$("p").filter(function(index) { return index < 5 }).toggleClass("highlight");

使用for循环重复循环一定次数(事先知道)。如果不知道重复的次数,则使用while循环(或each -函数式编程中的类似方法)

var i;
for (i = 0; i < 6; i += 1) {
    $("p")[i].toggleClass("highlight");
}