如何選擇最後的大孩子？

Question

考慮這個simplifcation：

<div class="conversation"> 
    <div class="chat_message_container"> 
     <div class="chat_message bubble">1</div> 
    </div> 
    <div class="chat_message_container"> 
     <div class="chat_message bubble">2</div> 
    </div> 
    <div class="chat_message_container"> 
     <div class="chat_message bubble">3</div> 
    </div> 
</div> 

現在我選擇每個.conversation最後.chat_message.bubble，因爲我有多個.conversation

所以$('.conversation .chat_message.bubble:last-child').each(..) 並不好，因爲每一個泡沫的最後一個孩子.chat_message_container，它遍歷所有的氣泡，我怎樣才能得到每個.conversation的最後一個孩子？

Answer 1

您可以使用.map()

使用

$('.conversation').map(function() { 
    return $(this).find('.chat_message.bubble:last'); //Find last element 
}).each(function(){ 
    alert($(this).text()) 
}); 

DEMO

Answer 2

應用:last-child到.chat_message_container元素來代替：

$(".conversation > .chat_message_container:last-child > .chat_message.bubble") 
.each(function() { 
    // ... 
}); 

Answer 3

試試這個..

var num = $(".conversation .chat_message_container:last-child .chat_message").text(); 
alert(num); 

小提琴：http://jsfiddle.net/L7Ps9/

Answer 4

這樣的選擇是：

$('.conversation .chat_message_container:last-child .chat_message.bubble:last-child') 

或者爲了簡單：

$('.conversation > div:last-child .chat_message.bubble:last-child')