嗯,我知道通过一些jQuery操作,我们可以为特定的div添加很多类:
<div class="cleanstate"></div>
让我们说,通过点击和其他一些事情,div可以获得很多类
<div class="cleanstate bgred paddingleft allcaptions ..."></div>
那么,除了一个类,我怎么能删除所有类?我提出的唯一想法是:
$('#container div.cleanstate').removeClass().addClass('cleanstate');
当removeClass()
杀死所有类时,div会搞砸,但在addClass('cleanstate')
之后添加它会恢复正常。另一个解决方案是使用基本CSS属性放置一个ID属性,这样它们就不会被删除,这也会提高性能,但我只是想知道另一个解决方案除去“.cleanstate”之外的所有其他
我问这个是因为,在真实的脚本中,div会遭受各种类的更改。
答案 0 :(得分:192)
您可以通过使用所需的类覆盖所有类值,而不是分两步执行,而只需使用attr
重置整个值:
jQuery('#container div.cleanstate').attr('class', 'cleanstate');
答案 1 :(得分:32)
使用attr直接将class属性设置为您想要的特定值:
$('#container div.cleanstate').attr('class','cleanstate');
答案 2 :(得分:14)
使用普通的JavaScript,而不是JQuery:
document.getElementById("container").className = "cleanstate";
答案 3 :(得分:3)
有时候你需要保留一些由于CSS动画而导致的类,因为只要删除所有类,动画就可能无效。相反,你可以保留一些类,并删除其余类似的东西:
$('#container div.cleanstate').removeClass('removethis removethat').addClass('cleanstate');
答案 4 :(得分:2)
关于抢夺回答和为了完整性你也可以使用querySelector和vanilla
document.querySelector('#container div.cleanstate').className = "cleanstate";
答案 5 :(得分:0)
如果您想保留一个或多个类并且想要除了这些类之外的类,该怎么办?如果您不想删除所有类,请再次添加该类。 使用attr和removeClass()重置第一个实例中的所有类,然后再次附加该类。如果您对正在重置的类使用某些动画,则会失败。
如果你想删除除了某些类之外的所有类,那么这是给你的。 我的解决方案是:removeAllExceptThese
Array.prototype.diff = function(a) {
return this.filter(function(i) {return a.indexOf(i) < 0;});
};
$.fn.removeClassesExceptThese = function(classList) {
/* pass mutliple class name in array like ["first", "second"] */
var $elem = $(this);
if($elem.length > 0) {
var existingClassList = $elem.attr("class").split(' ');
var classListToRemove = existingClassList.diff(classList);
$elem
.removeClass(classListToRemove.join(" "))
.addClass(classList.join(" "));
}
return $elem;
};
这不会重置所有类,只会删除必要的。
我在我的项目中需要它,我只需要删除不匹配的类。
您可以使用$(".third").removeClassesExceptThese(["first", "second"]);