JQuery .each () rückwärts

Ich verwende JQuery, um einige Elemente auf einer Seite auszuwählen und sie dann im DOM zu verschieben. Das Problem, das ich habe, ist, dass ich alle Elemente in der umgekehrten Reihenfolge auswählen muss, in der JQuery sie natürlich auswählen möchte. Zum Beispiel:

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

Ich möchte alle li-Elemente auswählen und den Befehl .each () für sie verwenden, aber ich möchte mit Element 5, dann Element 4 usw. beginnen. Ist dies möglich?

$($("li").get().reverse()).each(function() { /* ... */ });

Ich präsentiere Ihnen den saubersten Weg aller Zeiten in Form des kleinsten JQuery-Plugins der Welt:

jQuery.fn.reverse = [].reverse;

Verwendungszweck:

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

- Alles Gute an Michael Geary in seinem Beitrag hier: http://www.mail-archive.com/[email protected]/msg04261.html

Du kannst tun

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

gefolgt von

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

Hierfür gibt es verschiedene Möglichkeiten:

Erstens : ohne 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;
});

Demo hier

... und mit jQuery:

Sie können dies verwenden:

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

Demo hier

Eine andere Möglichkeit, auch jQuery mit Reverse zu verwenden, ist:

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

Diese Demo hier .

Eine weitere Alternative besteht darin, die length(Anzahl der Elemente, die mit diesem Selektor übereinstimmen) zu verwenden und von dort mit der indexjeder Iteration nach unten zu gehen . Dann können Sie dies verwenden:

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

Diese Demo hier

Eine weitere , die irgendwie mit der oben genannten verwandt ist:

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

Demo hier

Ich ziehe es vor, ein Reverse-Plug-In zu erstellen, z

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

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

Verwendung zB:

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

Wenn Sie die Methode nicht in jQuery.fn speichern möchten, können Sie sie verwenden

[].reverse.call($('li'));

Musste ein Reverse für $ .each machen, also habe ich die Vinay-Idee verwendet:

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

hat gut funktioniert, danke

Sie können mit der jQuery-Funktion nicht jede Funktion rückwärts durchlaufen, aber Sie können trotzdem die jQuery-Syntax nutzen.

Versuche Folgendes:

//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
}

Ich fand es Array.prototype.reversemit Objekten nicht erfolgreich, daher habe ich eine neue jQuery-Funktion erstellt, die als Alternative verwendet werden kann : jQuery.eachBack(). Es iteriert wie gewohnt jQuery.each()und speichert jeden Schlüssel in einem Array. Anschließend wird das Array umgekehrt und der Rückruf für das ursprüngliche Array / Objekt in der Reihenfolge der umgekehrten Schlüssel ausgeführt.

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);
}

Ich denke du brauchst

.parentsUntill()

Sie können es auch versuchen

var arr = [].reverse.call($('li'))
arr.each(function(){ ... })