使用jQuery的CSS子选择器

Question

我可以通过jQuery获取属于一个div的子元素(span)列表吗？我的意思是子元素的数量。我正在生成一个带有几个span的表单，并且我需要知道我已经生成了多少个span。

- Denees

Answer 1

您可以使用子选择器和length属性来实现此功能：

子选择器和length属性。

var numberOfSpans = $("#someId > span").length;

或者，如果您想要使用this作为示例，您可以使用children方法：

var numberOfSpans = $(this).children("span").length;

请注意，上面两个代码片段都提供了span元素的直接子代数量。它们不会计算更深层次的后代。如果你想要计算更深层次的后代，可以删除>字符，或者使用find代替children。

- James Allardice

---

谢谢大家，所有的解决方案都非常完美 :) - Denees

Answer 2

您可以通过以下方式获得此内容：

$('#div-id span').size();

http://api.jquery.com/size/

- jValdron

Answer 3

这将为您提供span的数量。

var count = $("div").find("span").size();

这将把子元素作为一个新的jQuery对象给出，以便循环遍历。

var list = []; 
list = $("div").children();

- Stefan Konno

---

children 返回的是另一个 jQuery 对象，而不是数组。 - James Allardice

一个空的jQuery对象长成这样: $("") 而不是 []。 - Andreas Louv

Answer 4

<div id="div1">
    <span>s</span>
    <span>s</span>
    <span>s</span>
    <span>s</span>
 </div>

$(function(){
  alert($("#div1 >span").size()) 
});

sample program here : http://jsfiddle.net/Bhrk2/

- Shyju