Jquery - 直系孩子

Question

我有这样的结构:

<ul id="mycustomid">
    <li><a>Item A</a>
        <ul class="children">
           <li><a>Child1 of A</a>
               <ul class="children">
                 <li><a>Grandchild of A</a>
                    <ul class="children">
                       <li><a>Grand Grand child of A</a></li>
                    </ul>
                </li>
               </ul>
           </li>
        </ul>
    </li>
    <li><a>Item B</a></li>
    <li><a>Item C</a></li>
</ul>

现在,我正在使用Jquery来获取ul#mycustomid的直接子节点.但是我的代码在我的结构中返回了所有li.我该怎么办？

这是我的代码:

$(document).ready(function() {
 var arri = $("#mycustomid>li").text();
 alert(arri);
});

我也试过了.children(),它给了我几乎相同的结果.这真让我紧张:(

我的警报框输出完全如下所示(包括那些白色间隙):

Item A 
Child1 of A
Grandchild of A

Grand Grandchild of A


ItemBItemC

然而,它应该只是(没有空格):

Item A 
Item B
Item C

要了解我的问题,您可以访问http://jsfiddle.net/yS6ZJ/查看实时版本

请指出我正确的方向,

谢谢

Answer 1

我认为你的选择器工作得很好 - 这就是你正在做的事情,这是有问题的.

当您调用时.text(),您将获得该元素的所有内容.所有这些,包括子元素.

试试这个:

$('#mycustomid > li').each(function() {
  alert($(this).find('a:eq(0)').text());
});