JQuery .each () vers l'arrière

J'utilise JQuery pour sélectionner certains éléments sur une page, puis les déplacer dans le DOM. Le problème que j'ai est que je dois sélectionner tous les éléments dans l'ordre inverse que JQuery veut naturellement les sélectionner. Par exemple:

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

Je veux sélectionner tous les éléments li et utiliser la commande .each () dessus, mais je veux commencer par l'élément 5, puis l'élément 4, etc. Est-ce possible?

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

Je vous présente la manière la plus propre de tous les temps, sous la forme du plus petit plugin jquery au monde:

jQuery.fn.reverse = [].reverse;

Usage:

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

-Tous les remerciements à Michael Geary dans son article ici: http://www.mail-archive.com/[email protected]/msg04261.html

Tu peux faire

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

suivi par

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

Voici différentes options pour cela:

D'abord : sans 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;
});

Démo ici

... et avec jQuery:

Vous pouvez utiliser ceci:

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

Démo ici

Une autre façon, en utilisant également jQuery avec reverse est:

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

Cette démo ici .

Une autre alternative consiste à utiliser le length(nombre d'éléments correspondant à ce sélecteur) et à descendre à partir de là en utilisant le indexde chaque itération. Ensuite, vous pouvez utiliser ceci:

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

Cette démo ici

Un de plus , un peu lié à celui ci-dessus:

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

Démo ici

Je préfère créer un plug-in inverse, par exemple

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

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

Utilisation par exemple:

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

Si vous ne souhaitez pas enregistrer la méthode dans jQuery.fn, vous pouvez utiliser

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

J'avais besoin de faire un reverse sur $ .each donc j'ai utilisé l'idée de Vinay:

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

a bien fonctionné, merci

Vous ne pouvez pas parcourir en arrière avec chaque fonction jQuery, mais vous pouvez toujours tirer parti de la syntaxe jQuery.

Essayez ce qui suit:

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

J'ai trouvé Array.prototype.reversesans succès avec des objets, donc je fait une nouvelle fonction de jQuery à utiliser comme une alternative: jQuery.eachBack(). Il parcourt comme d'habitude jQuery.each()et stocke chaque clé dans un tableau. Il inverse ensuite ce tableau et effectue le rappel sur le tableau / objet d'origine dans l'ordre des clés inversées.

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

Je pense que tu as besoin

.parentsUntill()

Vous pouvez aussi essayer

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