2

jQuery.removeClass可以不带参数来删除所有类，或者带有一个或多个空格分隔的类名的字符串，或者返回这样一个字符串的函数。我想知道是否有一种方法可以删除除原始 html 中指定的类以外的所有类（例如，由 jQuery 添加的类）。

$('.myElement').removeClass(function() {return $(this).attr('class').split(' ').slice(1).join(' ')})

删除除第一个类之外的所有类，但如果元素在 html 中有多个类，那将不会真正起作用。

4

4 回答 4

2

首次加载页面时，您必须复制原始类属性：

$('[class]').each(function() {
    $(this).data('orig-class', this.className);
});

现在，您可以“重置”它：

$elem.attr('class', $elem.data('orig-class'));
于 2013-07-29T01:54:50.623 回答
0

在提交任何更改之前，您必须将原始类列表缓存在一个变量中，否则您以后将无法恢复它。

据我测试，所有添加新类的方法（无论是否使用 jQuery）最终都会更改class属性、className属性和classList.

于 2013-07-29T01:54:35.827 回答
0

我认为您无法取回原始属性，因此您需要将其存储在数据中。

例如：

// On load, do this
myElement.data('originalclass', myElement.attr('class'));

// Later on, you can do this
myElement.attr('class', myElement.data('originalclass'));
于 2013-07-29T01:54:41.763 回答
0

我刚刚为此制作了一个快速插件...

它替换了原始的 addClass 函数，因此它存储您添加的每个类，因此当您不想删除它们时，它知道添加了哪些类addClass

这是新的addClass function

jQuery.fn._addClass = jQuery.fn.addClass; // Keep a copy of the addClass function

jQuery.fn.addClass = function( params ) {
    var _params = params.split(' '); // Split the classes into array
    var classes = this.data('classes') || []; // Get the current dynamic classes
    
    jQuery.each(_params, function( i, c ) {
        classes.push(c);
    }); // push the classes into the array
    
    this.data('classes', classes); // Re-set all classes
    this._addClass(params); // Add the class with the new addClass function
    return this;
};

这是删除动态类功能

jQuery.fn.remove_dynamic_classes = function() {
    var classes = this.data('classes')
    if( !classes ) return this;
    this.removeClass( classes.join(' ') );
    return this;
};

用法：

$('#test').addClass('one two three');
$('#test').remove_dynamic_classes(); // This will remove classes 'one', 'two', 'three'

这是一个演示

演示

这可能可以改进，但已经晚了，我明天可能会看看。您必须检查元素并使用 addClass 函数来查看它是否有效。

快速复制版

jQuery.fn._addClass=jQuery.fn.addClass;jQuery.fn.addClass=function(e){var t=e.split(" ");var n=this.data("classes")||[];jQuery.each(t,function(e,t){n.push(t)});this.data("classes",n);this._addClass(e);return this};jQuery.fn.remove_dynamic_classes=function(){var e=this.data("classes");if(!e)return this;this.removeClass(e.join(" "));return this}
于 2013-07-29T02:05:14.513 回答