На jQuery.каждый() назад
Я использую 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 и использовать.каждая команда() на них, но я хочу начать с пункта 5, затем пункт 4 и т. д. Возможно ли это?
12 ответов
Я представляю вам самый чистый способ когда-либо, в виде самого маленького в мире плагина jquery:
jQuery.fn.reverse = [].reverse;
использование:
$('jquery-selectors-go-here').reverse().each(function () {
//business as usual goes here
});
- все заслуги Майкла гири в его должности здесь:http://www.mail-archive.com/discuss@jquery.com/msg04261.html
можно сделать
jQuery.fn.reverse = function() {
return this.pushStack(this.get().reverse(), arguments);
};
следовал по
$(selector).reverse().each(...)
вот различные варианты для этого:
первый: без jQuery:
var lis = document.querySelectorAll('ul > li');
var contents = [].map.call(lis, function (li) {
return li.innerHTML;
}).reverse().forEach(function (content, i) {
lis[i].innerHTML = content;
});
демо здесь
... и с помощью jQuery:
вы можете использовать это:
$($("ul > li").get().reverse()).each(function (i) {
$(this).text( 'Item ' + (++i));
});
демо здесь
еще один путь, используя jQuery с реверс - это:
$.fn.reverse = [].reverse;
$("ul > li").reverse().each(function (i) {
$(this).text( 'Item ' + (++i));
});
это демо здесь.
еще один альтернативой является использование length
(количество элементов, соответствующих селектору) и спуститься оттуда с помощью index
на каждой итерации. Тогда вы можете использовать это:
var $li = $("ul > li");
$li.each(function (i) {
$(this).text( 'Item ' + ($li.length - i));
});
демо здесь
еще один, вид, связанный с одним выше:
var $li = $("ul > li");
$li.text(function (i) {
return 'Item ' + ($li.length - i);
});
демо здесь
Я предпочитаю создавать обратный плагин, например
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);
});
необходимо сделать реверс на $.каждый так я использовал 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
}
нашел Array.prototype.reverse
неудачно с объектами, поэтому я сделал новую функцию jQuery для использования в качестве альтернативы:jQuery.eachBack()
. Он повторяется как нормальный jQuery.each()
would и сохраняет каждый ключ в массив. Затем он отменяет этот массив и выполняет обратный вызов исходного массива/объекта в порядке обратных ключей.
jQuery.eachBack=function (obj, callback) {
var revKeys=[]; $.each(obj,function(rind,rval){revKeys.push(rind);});
revKeys.reverse();
$.each(revKeys,function (kind,i){
if(callback.call(obj[i], i, obj[i]) === false) { return false;}
});
return obj;
}
jQuery.fn.eachBack=function (callback,args) {
return jQuery.eachBack(this, callback, args);
}
Я признаю, что jQuery поддерживает и поощряет плагинов. Тем не менее, вы можете найти эту статью актуальной: Не изменяйте объекты, которыми вы не владеете. В этом случае, по крайней мере, я решил не расширять jQuery на случай, если другой плагин определяет обратный по-другому.
вот простое решение, которое не расширяет объект jQuery.
function jqueryReverse( set ) {
return [].reverse.call( set );
}
console.log( jqueryReverse( $( 'li' ) ) );