jQuery count elementos secundarios

Question

jQuery count elementos secundarios

<div id="selected">
  <ul>
    <li>29</li>
    <li>16</li>
    <li>5</li>
    <li>8</li>
    <li>10</li>
    <li>7</li>
  </ul>
</div>

Quiero contar el número total de elementos <li> en <div id="selected"></div>. ¿Cómo es posible usar .children([selector]) de jQuery?

281

javascript jquery

Author: Muhammed, 2010-11-27

Source

7 answers

$("#selected > ul > li").size()

O:

$("#selected > ul > li").length

28

Author: stillstanding,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-11-27 10:27:05

El más rápido:

$("div#selected ul li").length

17

Author: Ali Tarhini,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-11-27 10:26:50

var length = $('#selected ul').children('li').length
// or the same:
var length = $('#selected ul > li').length

Probablemente también podría omitir li en el selector de niños.

Véase .length.

13

Author: Felix Kling,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-11-27 10:24:58

Puede usar JavaScript (no necesita jQuery)

document.querySelectorAll('#selected li').length;

12

Author: Đặng Văn Thanh,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-06-26 10:09:51

$('#selected ul').children().length;

O aún mejor

 $('#selected li').length;

10

Author: Martin Algesten,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-11-27 10:26:37

Es simplemente posible con childElementCount en javascript puro

var countItems = document.getElementsByTagName("ul")[0].childElementCount;
console.log(countItems);

<div id="selected">
  <ul>
    <li>29</li>
    <li>16</li>
    <li>5</li>
    <li>8</li>
    <li>10</li>
    <li>7</li>
  </ul>
</div>

2

Author: Muhammed,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-11-03 07:35:07

score 526 · Accepted Answer

Puede utilizar .length con solo un selector de descendientes , así:

var count = $("#selected li").length;

Si tiene que usar .children(), entonces es así:

var count = $("#selected ul").children().length;

Puede probar ambas versiones aquí .

526

Author: Nick Craver,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-11-27 10:25:04