javascript jQuery removeClass() 但不是某些类
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7826379/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery removeClass() but not certain classes
提问by Pinkie
How can I do remove all classes from an element except certain classes. I'm assuming we can't use not with removeClass()
. Let say I have a <div class="aa bb cc dd ee ff"></div>
and I want to remove all classes except aa dd
. How can I do this.
如何从元素中删除除某些类之外的所有类。我假设我们不能使用 not with removeClass()
。假设我有一个<div class="aa bb cc dd ee ff"></div>
,我想删除除aa dd
. 我怎样才能做到这一点。
回答by Laurence Burke
Why don't you just replace the class attribute with the classes that you want like so
为什么不直接用你想要的类替换 class 属性
$('#yourElement').attr('class',"aa dd");
回答by Tim Banks
To make it a little cleaner, you could create a little extension.
为了使它更简洁,您可以创建一个小扩展。
jQuery.fn.removeClassExcept = function (val) {
return this.each(function () {
$(this).removeClass().addClass(val);
});
};
Then you could use it like
然后你可以像这样使用它
$("selector").removeClassExcept("aa dd");
Heres an example: http://jsfiddle.net/9xhND/
这是一个例子:http: //jsfiddle.net/9xhND/
UPDATE
更新
Using Brad Christie's logic, the update will now only keep classes that were originally there and not add new classes. http://jsfiddle.net/9xhND/1/
使用 Brad Christie 的逻辑,更新现在将只保留原来存在的类,而不会添加新类。 http://jsfiddle.net/9xhND/1/
jQuery.fn.removeClassExcept = function (val) {
return this.each(function (index, el) {
var keep = val.split(" "), // list we'd like to keep
reAdd = [], // ones that should be re-added if found
$el = $(el); // element we're working on
// look for which we re-add (based on them already existing)
for (var c = 0; c < keep.length; c++){
if ($el.hasClass(keep[c])) reAdd.push(keep[c]);
}
// drop all, and only add those confirmed as existing
$el
.removeClass() // remove existing classes
.addClass(reAdd.join(' ')); // re-add the confirmed ones
});
};
回答by Gabriele Petrioli
.removeClass()
accepts as a parameter a function that will return which classes to actually remove..
.removeClass()
接受一个函数作为参数,该函数将返回要实际删除的类。
so
所以
$('div').removeClass(function(i, class){
// variable class hold the current value of the class attribute
var list = class.split(' '); // we create an array with the classes
return list.filter(function(val){ // here we remove the classes we want to keep
return (val != 'aa' && val != 'dd');
}).join(' '); // and return that list as a string which indicates the classes to be removed..
});
回答by jbyrd
jQuery actually provides a callback parameter to the removeClass method, so you could use a simple javascript regular expression to return all the classes except the ones you don't want to remove:
jQuery 实际上为 removeClass 方法提供了一个回调参数,因此您可以使用一个简单的 javascript 正则表达式来返回所有类,除了您不想删除的类:
$('#myDiv').removeClass(function() {
return $(this).attr('class').replace(/aa|bb/g, '');
});
This way you don't add classes 'aa' and 'bb' if they don't already exist.
这样,如果类 'aa' 和 'bb' 尚不存在,您就不会添加它们。
You can see it in action here: http://jsfiddle.net/sr86u/3/
你可以在这里看到它的实际效果:http: //jsfiddle.net/sr86u/3/
回答by Sarfraz
You can remove all and add needed ones back:
您可以删除所有并添加所需的:
$('#divID').removeClass()
.addClass('aa dd'); // add multiple classes by separating with space
Note: Calling removeClass()
without specifying specific class name removes all classes.
注意:在removeClass()
不指定特定类名的情况下调用会删除所有类。
回答by jbyrd
One way you can do it is to just overwrite all classes with the class(es) you want to keep. So, if your div has an id of "myDiv", then you could do:
一种方法是用您想要保留的类覆盖所有类。因此,如果您的 div 的 id 为“myDiv”,那么您可以执行以下操作:
$('#myDiv').attr('class', 'aa dd');
回答by Brad Christie
If you know what classes you want to keep you can just re-add them (as others have already shown).
如果您知道要保留哪些类,则只需重新添加它们即可(正如其他人已经展示的那样)。
I'll assume though that it's not known whether those classes are already applied, so I'll take it a step further:
不过,我假设不知道这些类是否已经应用,所以我会更进一步:
var keep = ['aa','bb'], // list we'd like to keep
reAdd = [], // ones that should be re-added if found
$el = = $(el); // element we're working on
// look for which we re-add (based on them already existing)
for (var c = 0; c < keep.length; c++){
if ($el.hasClass(keep[c])) reAdd.push(keep[c]);
}
// drop all, and only add those confirmed as existing
$el
.removeClass() // remove existing classes
.addClass(reAdd.join(' ')); // re-add the confirmed ones