JQuery .each()의 역방향

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 등으로 시작하고 싶습니다.이게 가능합니까?

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

세계에서 가장 작은 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.http://http://www.mail-archive.com/discuss

할수있습니다

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

method를 jQuery.fn에 저장하지 않으려는 경우 를 사용할 수 있습니다.

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

각각 $.를 역이용해야 했기 때문에 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()각 키를 배열에 저장합니다.그런 다음 해당 배열을 반전시키고 원래 배열/개체에 대해 반전된 키 순서로 콜백을 수행합니다.

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

시험해 볼 수도 있습니다.

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

당신이 필요하다고 생각해요.

.parentsUntill()

언급URL : https://stackoverflow.com/questions/1394020/jquery-each-backwards