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

Question

此 $ 代码和 jsfiddle 链接中链接的 animate.css 为框或图像添加动画效果。

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

添加动画类和效果类。

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

删除类。

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

这是我当前使用的代码和 jsFiddle:

jsfiddle

 $(document).ready(function () {
        $('.box1').addClass('animated bounceInUp');
        $('.box2').addClass('animated bounceInLeft');
        $('.box3').addClass('animated flipInX');
        //
        var wait = window.setTimeout(function () {
            $('#boxes *').removeClass('animated');
        }, 3300);

    });

但是，这只会从元素中删除动画类(所有效果都不同)，因此您无法添加新的效果类。我不知道在“.removeClass('animated')”中添加什么动画。 提前致谢。

Answer 1

更新:我正在重新分配类属性，该属性会删除初始类 .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 方法都要快。

只要 #boxes 元素的所有直接子 div 确实是框，那么选择器 $('#boxes > div') 很好。

更新的 fiddle : http://jsfiddle.net/rUHpf/18/