jQuery: количество тегов li первого уровня (исключая теги ul> li потомков)

Question

HTML:

<ul id='top_nav'>
  <li><a href="">xxx</a></li>
  <li><a href="">xxx</a></li>
  <li><a href="">xxx</a></li>
  <li>
    <ul>
      <li><a href="">xxx</a></li>
      <li><a href="">xxx</a></li>
    </ul>
  </li>
  <li><a href="">xxx</a></li>
</ul>

Вопрос:

Как узнать количество тегов li первого уровня? Таким образом, в этом примере вывод будет 5, а не 7.

Answer 1

$("#top_nav > li").size() должно сработать.

Это работает, потому что селектор, похожий на foo > bar, выбирает непосредственных потомков foo, соответствующих строке соответствия.функция size() возвращает количество выбранных объектов.

Answer 2

Используйте некоторые CSS с вашим запросом и сделайте его еще проще.Помните, jQuery уже выполнил всю тяжелую работу, поэтому у вас ее тоже нет:

$("ul li:first-child")
//  the previous simply is a call to all unordered list items that re first in the list
$("ul li:first-child").length
// the previous will get you the total count of all first list items

LOL только что понял, что я неправильно понял вопрос, в случае чего ответ уже есть

$("#top_nav > li")

Answer 3

Дэвид и Джаспер дают хорошие варианты, но вам также нужно отфильтровать li, у которого есть дочерний элемент ul, чтобы получить 4 в качестве вывода:

$("#top_nav > li").filter(function() {
    return $(this).children('ul').length == 0;
}).size()​