javascript - jQuery:删除和重新添加类

Question

在问这个问题之前我已经搜索了很多，但我可能搜索/问错了问题:

我想选择一个元素的最后两个类(具有多个类和未知数量的类)并将其存储在一个变量中。然后我想删除这两个类并在稍后将它们添加回来(如 toggleClass)。第一类已知，第二类未知。

例如:

<div class="c1 c2 c3 c-unknown"></div>

我想选择c3和c-unknown

我已经尝试过 split()，这似乎是解决方案，但我无法完全让它发挥作用。

感谢您提供的任何帮助/指导。

Answer 1

您可以将它们存储在元素本身上，从而允许隔离多个实例

以下解决方案不需要类以任何特定顺序排列，也不需要元素上有多少个类。

$('.c1').each(function () {
    /* array of classes on elemnt*/
    var classes = $(this).attr('class').split(' ');
    /* remove the targeted selector from array */
    classes.splice(classes.indexOf('c1'), 1);
    /* remove the extra classes from element and store */
    $(this).removeClass(classes.join(' ')).data('classes', classes);

});

对于特定元素也可以使用attr(function)

 $('.c1.Specific').attr('class', function(_, existingClasses){      
        var classes = existingClasses.split(' ');        
        classes.splice(classes.indexOf('c1', 1));
        $(this).data('classes', classes);
        return 'c1';
 });

然后重新使用存储的类

var $el = $('.c1:first');
$el.addClass( $el.data('classes').join(' '))

DEMO