Як я можу порахувати кількість дітей?

108

У мене є список

<ul>
  <li>
  <li>
  <li>
  ...
</ul>

Мені потрібен jQuery для підрахунку кількості елементів у моєму списку.

jquery

— аневризм
джерело

1

забути jquerydocument.querySelectorAll('ul li').length

— caub

188

Ви можете використовувати .length, як це:

var count = $("ul li").length;

.lengthпоказує , скільки матчів селектора знайшов, так це розраховує , скільки <li>під <ul>елементами у вас є ... якщо є суб-діти, використовуйте "ul > li"замість того, щоб отримати тільки прямі дитина. Якщо <ul>на вашій сторінці є інші елементи, просто змініть селектор, щоб він відповідав лише його, наприклад, якщо він має ідентифікатор, який ви б використовували "#myListID > li".

В інших ситуаціях, коли ви не знаєте дочірнього типу, ви можете скористатися *селекторним символом (wildcard) або .children(), наприклад, таким чином:

var count = $(".parentSelector > *").length;

або:

var count = $(".parentSelector").children().length;

— Нік Крейвер
джерело

1

Що робити, якщо невідомо, що дитина "лі", і може бути чим завгодно?

— Starx

7

@Starx:$("#parent").children().length

— rekamoyka

1

@AlecAnanian, Ні, я знаю як. Я маю на увазі, що я сподівався, що Нік також додасть це до своєї відповіді.

— Starx

2

@Starx - додано, якщо це допоможе декільком людям у дорозі :)

— Нік Крейвер

Що робити, якщо елемент не видно?

— ᴍᴀᴛᴛ ʙᴀᴋᴇʀ

6

Для цього вам не потрібен jQuery. Ви можете використовувати JavaScript .childNodes.length.

Просто не забудьте відняти 1, якщо ви не хочете включати текстовий вузол за замовчуванням (який за замовчуванням порожній). Таким чином, ви використовуєте наступне:

var count = elem.childNodes.length - 1;

— Зак Сосьє
джерело

1

Спробуйте скористатися:

var count = $("ul > li").size();
alert(count);

0

Що робити, якщо ви використовуєте це для того, щоб визначити поточний селектор, щоб знайти його дітей, і це справедливо: <ol>значить, <li>підписано, як написати селекторну var count = $(this+"> li").length;роботу.

— Огужан
джерело

якщо в ol є клас, який ви можете написати$("ol.class > li").length

— Qwerty

0

Це можна зробити за допомогою jQuery:

Цей метод отримує список своїх дітей, а потім підраховує довжину цього списку настільки ж просто.

$("ul").find("*").length;

Метод find () проходить DOM вниз вздовж нащадків, аж до останнього нащадка.

Примітка: метод дітей () переходить на один рівень вниз по дереву DOM.

— Юссоф Х.
джерело