如果元素具有类，则添加类 - JQuery

Question

我想要为具有“alignleft”类的元素添加类。我的代码：

```javascript $('.alignleft').addClass('newClass'); ```

这将为所有带有“alignleft”类的元素添加名为“newClass”的新类。

$(document).ready(function () {
    if($('.foto').children().hasClass('alignleft')){
        $(this).addClass('animated bounceInLeft');
    }
});

它不起作用，我不知道为什么。然而，如果我使用$('.foto').children().addClass('animated bounceInLeft');，它会将类应用于所有具有'alignleft'类的子元素。所以问题可能在于$(this)？

- Roberto

Answer 1

你可以使用类选择器来定位元素，然后向它们添加类：

$('.foto .alignleft').addClass('animated bounceInLeft');

- Milind Anantwar

Answer 2

你不能使用 this，它指的是窗口对象。相反，在 children() 方法中使用类作为选择器。

$('.foto').children('.alignleft').addClass('animated bounceInLeft');

或者使用子选择器(>)

$('.foto > .alignleft').addClass('animated bounceInLeft');

- Pranav C Balan

Answer 3

尝试

$(document).ready(function() {
 var elem = $('.foto .alignleft');
  if (elem) {
    elem.addClass('animated bounceInLeft');
  }
});

---

或者

$(document).ready(function() {
   $('.foto .alignleft').addClass('animated bounceInLeft');
});

$(document).ready(function() {
 var elem = $('.foto .alignleft');
  if (elem) {
    elem.addClass('animated bounceInLeft');
  }
});

.alignleft{color:red;}
.alignright{color:green;}

.animated{background:lightgrey;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="foto">
  <div class="alignleft">
    Div A
  </div>
  
  <div class="alignleft">
    Div B
  </div>
  
  <div class="alignright">
    Div C
  </div>
   <div class="alignright">
    Div D
  </div>
</div>

- zakhefron