jquery - jquery .each( )

  显示原文与译文双语对照的内容

我使用JQuery来选择页面上的一些元素,然后在DOM中移动它们。 我所遇到的问题是,我需要按照JQuery自然想要选择的相反顺序选择所有元素。 例如:


<ul>
 <li>Item 1</li>
 <li>Item 2</li>
 <li>Item 3</li>
 <li>Item 4</li>
 <li>Item 5</li>
</ul>

我想选择所有的li项目并使用. each() 命令,但我想从项目 5开始,然后项目 4 等等 是这样?

时间:

我向你展示了最干净的方式,它是世界上最小的jquery插件的形式:


jQuery.fn.reverse = [].reverse;

使用方法:


$('jquery-selectors-go-here').reverse().each(function () {
//business as usual goes here
});

-All在他的博文中对 Michael Geary的信用: http://www.mail-archive.com/discuss@jquery.com/msg04261.html

你可以做


jQuery.fn.reverse = function() {
 return this.pushStack(this.get().reverse(), arguments);
};

后面是


$(selector).reverse().each(...)

我喜欢创建反向 plug-in ( 例如


jQuery.fn.reverse = function(fn) { 
 var i = this.length;

 while(i--) {
 fn.call(this[i], i, this[i])
 }
};

用法:


$('#product-panel> div').reverse(function(i, e) {
 alert(i);
 alert(e);
});

这里有不同的选项:

你可以使用:


$($("ul> li").get().reverse()).each(function (i) {
 $(this).text( 'Item ' + (++i));
});

演示这里

反向 is, 另一个也的方法,用 jquery:


$.fn.reverse = [].reverse;
$("ul> li").reverse().each(function (i) {
 $(this).text( 'Item ' + (++i));
});

这个演示这里

一个替代方法是使用 length ( 匹配该选择器的元素数), 从那里下去使用 index 每个迭代。 然后你可以使用:


var nr_of_divs = $("ul> li").length;
$("ul> li").each(function (i) {
 $(this).text( 'Item ' + (nr_of_divs - i));
});

这个演示这里

,与上面的:


var nr_of_divs = $("ul> li").length;
$("ul> li").text(function (i) {
 return 'Item ' + (nr_of_divs - i);
});

这里演示

需要在 $.each 上做反向操作,所以我使用了Vinay的思想:


//jQuery.each(collection, callback) =>
$.each($(collection).get().reverse(), callback func() {});

工作正常,谢谢

你不能用jQuery的每个函数来迭代,但是你仍然可以利用jQuery语法。

请尝试以下操作:


//get an array of the matching DOM elements 
var liItems = $("ul#myUL li").get();

//iterate through this array in reverse order 
for(var i = liItems.length - 1; i> = 0; --i)
{
//do Something
}

...