jQuery findClass并显示这个类是什么？

Question

我正在尝试找到类"active"的元素,然后回显它所拥有的其他类,并且只选择字符串的开头.

HTML:

<div class="cmButtons">
    <ul>
        <li class="cmAuto_btn a active">Auto BTN</li>
        <li class="cmPro_btn a">Pro BTN</li>
        <li class="cmFocus_btn a">Focus BTN</li>
        <li class="cmBright_btn a">Bright BTN</li>
        <li class="cmLow_btn a">Low BTN</li>
        <li class="cmMotion_btn a">Motion BTN</li>
        <li class="cmCustom_btn a">Custom BTN</li>
    </ul>
</div>

CSS:

#result{background:#EEE;border:1px solid #CCC;margin:20px 0;height:30px;line-height:30px;width:500px;}

Javascript(使用jQuery):

if($('.cmButtons ul li').hasClass("active")){
    var activeLi = $(this).attr("class");
    $('#result').html(activeLi);
}

JS Fiddle上的演示.

所以,基于小提琴;

活跃元素是: <li class="cmAuto_btn a active">Auto BTN</li>

jQuery应该输出类: cmAuto_btn a active

然后jQuery应该修改要呈现的字符串 cmAuto_btn

我怎样才能做到这一点？

Answer 1

您需要迭代匹配元素集each.然后,您可以在空格上拆分类名,并获取结果数组的第一个元素:

$('.cmButtons ul li').each(function() {
    if($(this).hasClass("active")) {
       var firstClass = $(this).attr("class").split(" ")[0];
    } 
});

这是一个更新的例子.

这里有一个替代方案,由于下面的评论(仍然使用each以防有多个元素与类active):

$('.cmButtons ul li.active').each(function() {
    var firstClass = $(this).attr("class").split(" ")[0];
});

您应该使用这个,除非您还需要对没有active该类的元素执行某些操作,在这种情况下,您可以将上述示例与else块一起使用.