使用jquery对immediate子DIV元素进行计数

$("#foo > div").length

将ID为“foo”的元素的子元素直接指定为div。然后检索生成的包装集的大小。

我建议使用 $('#foo').children().size() 以获得更好的性能。

我创造了一个 jsperf 测试以查看速度差和 children() 方法至少击败了子选择器(foo>div)方法 60% 铬合金(金丝雀v15) 20-30% 在Firefox(v4)中。

顺便说一下,不用说,这两种方法产生相同的结果(在本例中是1000)。

[更新]我已经更新了测试,以包括size()和length测试,它们没有太大区别(结果: length 使用速度(2%)比 size() )

[更新]由于在操作中看到不正确的标记(在我更新“已验证标记”之前),两者都 $("#foo > div").length 和; $('#foo').children().length 结果是一样的( jsfiddle )但是,要正确回答只获取“div”子级,应该使用子选择器以获得正确和更好的性能。

$("#foo > div") 

选择作为foo的直接后代的所有div
一旦您有了一组子级,就可以使用大小函数:

$("#foo > div").size()

或者你可以使用

$("#foo > div").length

两者都将返回相同的结果

$('#foo').children('div').length

作为对mrcoders的回应,使用jsper来回答为什么不直接使用dom节点?

var $foo = $('#foo');
var count = $foo[0].childElementCount

您可以在这里尝试测试: http://jsperf.com/jquery-child-ele-size/7

此方法得到46095次/秒,而其他方法得到的最大值为2000次/秒。

$('#foo > div').size()

$("#foo > div").length

jquery有一个.size()函数,它将返回元素出现的次数,但如jquery文档中指定的那样,它的速度较慢,返回的值与.length属性相同,因此最好只使用.length属性。 从这里: http://www.electrictoolbox.com/get-total-number-matched-elements-jquery/

var divss = 0;
$(function(){
   $("#foo div").each(function(){
    divss++;

   });
   console.log(divss);  
});     
<div id="foo">
  <div id="bar" class="1"></div>
  <div id="baz" class="1"></div>
  <div id="bam" class="1"></div>
</div>

var n_numTabs = $("#superpics div").size();

或

var n_numTabs = $("#superpics div").length;

如前所述,两者都返回相同的结果。
但是size()函数更像jquery“p.c”。
我的页面也有类似的问题。
现在,只需省略>即可正常工作。

对于jquery的最新版本,您可以使用 $("#superpics div").children().length .

$("div", "#superpics").size();