Làm thế nào tôi có thể đếm số trẻ em?

Tôi có một danh sách

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

Tôi cần jQuery để đếm số lượng mục trong danh sách của mình.

Bạn có thể sử dụng .length, như thế này:

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

.lengthcho biết có bao nhiêu kết quả phù hợp với bộ chọn được tìm thấy, do đó, điều này sẽ tính xem bạn có bao nhiêu phần tử <li>bên dưới <ul>... nếu có phần tử con, hãy sử dụng "ul > li"thay thế để chỉ lấy phần tử con trực tiếp . Nếu bạn có các <ul>phần tử khác trong trang của mình, chỉ cần thay đổi bộ chọn để chỉ khớp với phần tử của nó, ví dụ: nếu nó có ID mà bạn sử dụng "#myListID > li".

Trong các tình huống khác mà bạn không biết loại con, bạn có thể sử dụng *bộ chọn (ký tự đại diện) hoặc .children()như sau:

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

hoặc là:

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

Bạn không cần jQuery cho việc này. Bạn có thể sử dụng JavaScript .childNodes.length.

Chỉ cần đảm bảo trừ đi 1 nếu bạn không muốn bao gồm nút văn bản mặc định (nút này trống theo mặc định). Vì vậy, bạn sẽ sử dụng như sau:

var count = elem.childNodes.length - 1;

Cố gắng sử dụng:

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

Điều gì sẽ xảy ra nếu bạn đang sử dụng điều này để xác định bộ chọn hiện tại để tìm con của nó, vì vậy điều này đúng: <ol>sau đó có <li>cách viết một bộ chọn var count = $(this+"> li").length;sẽ không hoạt động ..

Bạn có thể làm điều này bằng cách sử dụng jQuery:

Phương thức này nhận một danh sách các con của nó sau đó đếm độ dài của danh sách đó, đơn giản như vậy.

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

Phương thức find () đi ngang qua DOM xuống dưới dọc theo con cháu, đến hết phương thức con cuối cùng.

Lưu ý: phương thức children () truyền qua một cấp độ duy nhất xuống cây DOM.