Question

我想用类名来计算每个第一个li元素，这是我的代码：

<div>
<ul>
    <li><a class="active" index="0" href="#">selector1</a></li>
    <li><a class="" index="1" href="#">selector1</a></li>
    <li><a class="" index="2" href="#">selector1</a></li>
</ul>
<ul>
    <li><a class="" index="0" href="#">selector1</a></li>
    <li><a class="active" index="1" href="#">selector1</a></li>
    <li><a class="" index="2" href="#">selector1</a></li>
</ul>
<ul>
    <li><a class="active" index="0" href="#">selector1</a></li>
    <li><a class="" index="1" href="#">selector1</a></li>
    <li><a class="" index="2" href="#">selector1</a></li>
</ul>
</div>

JS：

var countz = $('div ul').filter(function(){
    return $(this).find('.active:first').length; }).length;

alert(countz);

但是我的结果显示3.根据这个html任何想法应该是2？谢谢！

这里小提琴：http://jsfiddle.net/Tf7g8/

Answer 1

这样的事情：

var countz = $('div>ul>li:first-child>.active').length;

alert(countz);

其中只计算具有类a的所有active标记，并且是li元素的子元素，这些元素本身就是第一个子元素。似乎更简单。

这里的工作示例：http://jsfiddle.net/GRcpL/2/

Answer 2

这就是诀窍：

var countz = 0;
$('div ul li:first').find('a').each(function(){
    if($(this).hasClass("active"))
        countz++;
});

http://jsfiddle.net/jonnysooter/Tf7g8/2/

Answer 3

我会那样做。

var countz = $('div ul').filter(function(){
    return $(this).find('li:first').has('.active').length;
}).length;

alert(countz);

Answer 4

或者Size()与nth-child()一起使用（如果使用 jQuery v1.7 或在下面

）

var active_li_count = $('li:nth-child(1) .active').size();
alert(active_li_count);

小提琴：http://jsfiddle.net/cQKhv/

注意：自jQuery 1.8起，不推荐使用.size（）方法。使用相反.length属性。

jQuery使用类名计算每个第一个li元素

4 个答案: