如何選擇最後的大孩子？

考慮這個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的最後一個孩子？

來源

2014-07-16 eric.itzhak

您可以使用.map()

使用

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

DEMO

來源

2014-07-16 10:22:05 Satpal

使用選擇器是我的目標，但是由於我混淆了簡化並忘記提及對話不在同一個父級，我用這個解決方案。感謝Satpal！ –

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

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

來源

2014-07-16 10:20:22

雖然它是有道理的它似乎沒有工作... –

它應該與你的問題中的標記一起工作。也許這種簡化不代表你的實際標記？ –

是的，我恐怕我錯了，'.conversations'不依賴於同一個容器 –

試試這個..

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

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

來源

2014-07-16 10:31:42 next2u

這樣的選擇是：

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

或者爲了簡單：

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

來源

2014-07-16 10:32:19

如何選擇最後的大孩子？

回答

相關問題