JQuery：如何在 DOM 树中获取所有最底层的孩子？答案

【问题标题】：JQuery: How to get all bottom-most children in a DOM tree?JQuery：如何在 DOM 树中获取所有最底层的孩子？
【发布时间】：2014-08-05 03:45:01
【问题描述】：

基于下面的 DOM 树，我想获取所有 <p> 元素，它们是每个以 message 为类的 div 的子元素，并将它们全部放入一个数组中。这将创建一个对象数组。

注意：ul 及其所有级别的所有子级都可以在任何给定时间动态添加到 dom。

我该怎么做？

我试过了

    var messages = $('.rightP').find('li>.message>p');
    $.each(messages,function(){
        console.log(this);
    });

但没有运气

DOM 树

<ul class="rightP">
    <li>
        <div class="sender">
            <p>David</p>
        </div>
        <div class="message">
           <p>Hello</p>
        </div>
    </li>
    <li>
        <div class="sender">
            <p>Watson</p>
        </div>
        <div class="message">
           <p>yes anything?</p>
        </div>
        <div class="message">
         ....
    </li>
    ...

</ul>

【问题讨论】：

你可以像这样得到它们：jsfiddle.net/scrowler/C79Pb - 没有给它们排序，因为你没有给出这些数据属性的例子
@scrowler 如果你回答了，我可能会接受。似乎不再需要订购了。

标签： javascript jquery arrays dom

【解决方案1】：

你使用了错误的 jQuery 选择器。将 $('.rightP').('li>.message>p') 替换为 $('.message > p') 或者您可以这样做。

var messages = jQuery('.message > p');

jQuery.each(messages, function (index, elem) {
    var message = jQuery(elem);
    console.log(message.text())
});

这是working fiddle。

【讨论】：

【解决方案2】：

$('.rightP').('li>.message>p');

错误的说法。你应该试试

$('.rightP').find('li>.message>p');

等等……

【讨论】：

这只是一个错字。感谢您的纠正，但您应该刚刚对我的问题发表了评论。

【解决方案3】：

你可以得到所有像下面这样的人

var messages = $('.rightP').find('li>.message>p');
$.each(messages,function(){
    console.log(this);
});

【讨论】：