使用jquery从多个元素中删除多个类

这个$code和jsfiddle链接中链接的animate.css将动画效果添加到框或图像中

$('.box1').addClass('animated bounceInUp');

添加动画类和效果类

$('.box1').removeClass('animated bounceInUp');

删除类

这里的问题是，我计划使用不少于100个框/图像，因此应该有一种方法可以同时添加/删除所有动画和效果类

这是我目前正在使用的代码和JSFIDLE：

但是，这只会从元素中删除动画类（所有效果都不同），因此不能添加新的效果类。我不知道在“.removeClass（'animated'）中使用动画添加什么。

---

提前感谢。

更新：我正在重新分配class属性，该属性将删除初始class

.box1

、

.box2

之后的所有类

$(function () {
    $('.box1').addClass('animated bounceInUp');
    $('.box2').addClass('animated bounceInLeft');
    $('.box3').addClass('animated flipInX');
    //
    var wait = window.setTimeout(function () {
        $('#boxes > div').each(function(){
            this.className = this.className.split(' ')[0];
        })
    }, 3300);
});

直接使用JavaScript

this.className

比任何jQuery方法都要快

只要

#box

元素的所有直接子

div

确实是box，那么选择器

$（'#box>div'）

就可以了

---

更新的Fiddle:

您可以通过jQuery

attr

方法设置任何HTML标记属性

如果要从任何具有“动画”类的对象中删除所有类，但将该类保留为“动画”，则可以使用以下方法：

$(".animated").attr("class", "animated");

---

这将通过将所有匹配标记的“class”属性设置为“animated”来删除所有其他类，而无需其他操作。

您可以使用queue来代替setTimeout：

$(".box1").removeClass("animated bounceInUp").delay(1000).queue(function(next){
    $(".box2").removeClass("animated bounceInLeft");
    next();
});

---

您可以通过在函数-$（#box*'）中省略名称来删除所有类；而#box是一个元素的ID-如果需要获取所有元素，可以使用$（'element[class^=“box”）。removeClass（）；@JayBlanchard OP说

“所以应该有一种方法可以同时添加/删除所有动画和效果类”

。因此，他不想摆脱非动画和非效果类，因为这些类需要每个类的特定性才能删除。@IAMBRIANSRED有大约35个效果，我将使用100多个盒子。我只需要从所有盒子类中删除所有最近添加的效果类。@IAMBRIANSRED我留下了深刻印象我知道每个框上只应用动画和效果类。@JayBlanchard OP将新类附加到选择器上，该选择器本身就是一个类。@iambriansreed所以我需要在动画类之后添加所有可用的效果类？大约有50到60个效果。[链接]：（不幸的是，所有相关的DOM元素都没有统一的类名。

$(".box1").removeClass("animated bounceInUp").delay(1000).queue(function(next){
    $(".box2").removeClass("animated bounceInLeft");
    next();
});