Question

如何将类值更改为其他值：

这是html：

<div class="example_infobox">
  <div class="col-md-3 col-sm-6 col-xs-12">
    <div class="info-box">
      <span class="info-box-icon bg-aqua"><i class="fa fa-envelope-o"></i></span>
      <div class="info-box-content">
        <span class="info-box-text">Messages</span>
        <span class="info-box-number">1,410</span>
      </div><!-- /.info-box-content -->
    </div><!-- /.info-box -->
  </div><!-- /.col -->
</div>

这是jQuery代码：

$('.example_infobox .info-box-icon.bg-aqua').attr('class', 'info-box-icon ' + 'bg-green');

上面的jQuery代码发生了变化：

<span class="info-box-icon bg-aqua">

为：

<span class="info-box-icon bg-green">

上面的代码可以工作，但是可以编写jQuery代码来改变类，只需用bg-aqua替换bg-green而不必指定整个类（就像我在jQuery中所做的那样）码）？我的意思是，是否可以用新值替换类的一部分，类似于C＃中的string.replace？

由于

Answer 1

您可以使用$.fn.toggleClass()

使用

$('.example_infobox .info-box-icon.bg-aqua').toggleClass('bg-aqua bg-green');

或，$.fn.removeClass()和$.fn.addClass()

的组合

$('.example_infobox .info-box-icon.bg-aqua').removeClass('bg-aqua').addClass('bg-green');

Answer 2

$('.example_infobox-icon').removeClass('bg-aqua').addClass('bg-green')

Answer 3

您可以先通过'.hasClass（）'检查其中存在哪个类。然后您可以应用添加和删除这样的类：

if($('.example_infobox .info-box-icon.bg-aqua').hasClass('bg-green'))
{
    $('.example_infobox-icon').removeClass('bg-green').addClass('bg-aqua');
}
else
{
    $('.example_infobox-icon').removeClass('bg-aqua').addClass('bg-green');
}

jQuery替换了一个class属性

3 个答案: