jquery每個循環中的每個循環

Question

我有一些div用作容器，我想循環它們，然後遍歷它中的項目。

所以不$('.stackContainer .stackItem').each(，但這樣的事情：

// setup stacks 
$('.stackContainer').each(function(containerIndex) { 
    //console.log($(this)); 
    console.log(containerIndex); 

    $(this).('.stackItem').each(function(itemIndex) { 
     console.log(itemIndex);  
    } 
}); 

只有這樣的工作。 這可能怎麼樣？

Answer 1

嘗試

$('.stackContainer').each(function(containerIndex) { 
    //console.log($(this)); 
    console.log(containerIndex); 

    $(this).find('.stackItem').each(function(itemIndex) { 
     console.log(itemIndex);  
    } 
}); 

Answer 2

嘗試find()方法：

$('.stackContainer').each(function(containerIndex) { 
    //console.log($(this)); 
    console.log(containerIndex); 

    $(this).find('.stackItem').each(function(itemIndex) { 
     console.log(itemIndex);  
    } 
}); 

Answer 3

許多這樣做的方法，如其他答案均表示。這裏有一個解決方案：http://jsfiddle.net/cezHH/3/

$(".stackContainer").each(function(stackIndex) { 
    $(this).children().css('class', '.stackItem').each(function(itemIndex) { 
     $(this).html($(this).html() + "=>" + itemIndex); 
    }); 
});​ 

或者，如果你想要做的是迭代所有在它們出現在頁面上的順序.stackItem的div，你實際上並不關心父母.stackContainer的div ，那麼你可以這樣做$('.stackItem').each(function(index) { ... });

嵌套遍歷.stackItem div的循環的原因是，如果您希望itemIndex變量在您每次切換父容器時重置爲零。

Answer 4

在一個側面說明，出於性能考慮，應避免使用jQuery的每個（），如果它有可能是收集將是任何大小：

http://net.tutsplus.com/tutorials/javascript-ajax/10-ways-to-instantly-increase-your-jquery-performance/

http://jsperf.com/jquery-each-vs-for-loop