Question

假设我有一个类似以下的列表

  <ul>
     <li id="slide-a" class="slide-li active-slide"><a href="#" >A</a></li>
     <li id="slide-b" class="slide-li"><a href="#" >B</a></li>
     <li id="slide-c" class="slide-li"><a href="#" >C</a></li                        
  </ul>

现在，使用Jquery我想找出哪个Element有类'active-class'。一种方法是使用嵌套的if语句：

if($("#slide-a").hasClass('active-slide'))
{
  active = 'slide-a';
}
else
{
  if($("#slide-b").hasClass('active-slide'))
  {
    active = 'slide-b';
  }
  else
  {
    if($("#slide-c").hasClass('active-slide'))
    {
      active = 'slide-c';
    }
  }
}

我的问题是，是否有任何方法可以优化上面的代码。是否有一种通用的方法来实现这一点，即使我在ul中添加10个以上的代码，代码也可以正常工作而无需任何修改。

Answer 1

也许只是

var active = $(".active-slide").attr("id");

Demo

Answer 2

使用Attribute starts with selector和.each()。试试这个：

$(document).ready(function(){
    $('li[id^=slide]').each(function(){
        if($(this).hasClass('active-slide'))
            alert($(this).attr('id'));
    });
});

<强> DEMO

如果您在课程active-slide中有多个课程，请使用此处：

$(document).ready(function(){
    var idVal = [];
    $('li[id^=slide]').each(function(){
        if($(this).hasClass('active-slide'))
            idVal.push($(this).attr('id'));
    });
    console.log(idVal);
});

<强> DEMO

Answer 3

你可以在ul上使用jQuery $.each()进行迭代。

小提琴来了。

更好的方法来查找哪个元素具有元素数组中的特定类

3 个答案: