如何选择最后的大孩子？

考虑这个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

如何选择最后的大孩子？

回答

相关问题