有没有什么简单的方法来删除所有匹配的类,例如,
color-*
如果我有一个元素:
<div id="hello" class="color-red color-brown foo bar"></div>
去除后,它将是
<div id="hello" class="foo bar"></div>
谢谢!
有没有什么简单的方法来删除所有匹配的类,例如,
color-*
如果我有一个元素:
<div id="hello" class="color-red color-brown foo bar"></div>
去除后,它将是
<div id="hello" class="foo bar"></div>
谢谢!
当前回答
如果你想在其他地方使用它,我建议你扩展。这个对我来说很好。
$.fn.removeClassStartingWith = function (filter) {
$(this).removeClass(function (index, className) {
return (className.match(new RegExp("\\S*" + filter + "\\S*", 'g')) || []).join(' ')
});
return this;
};
用法:
$(".myClass").removeClassStartingWith('color');
其他回答
我们可以通过.attr("class")获取所有的类,和数组,循环和过滤器:
var classArr = $("#sample").attr("class").split(" ")
$("#sample").attr("class", "")
for(var i = 0; i < classArr.length; i ++) {
// some condition/filter
if(classArr[i].substr(0, 5) != "color") {
$("#sample").addClass(classArr[i]);
}
}
演示:http://jsfiddle.net/L2A27/1/
在单词边界上拆分正则表达式\b并不是最好的解决方案:
var prefix = "prefix";
var classes = el.className.split(" ").filter(function(c) {
return c.lastIndexOf(prefix, 0) !== 0;
});
el.className = classes.join(" ");
或作为jQuery mixin:
$.fn.removeClassPrefix = function(prefix) {
this.each(function(i, el) {
var classes = el.className.split(" ").filter(function(c) {
return c.lastIndexOf(prefix, 0) !== 0;
});
el.className = classes.join(" ");
});
return this;
};
如果你有多个元素的类名为“example”,要删除所有的“color-”类,你可以这样做:
var objs = $('html').find('.example');
for(index=0 ; index < obj1s.length ; index++){
objs[index].className = objs[index].className.replace(/col-[a-z1-9\-]*/,'');
}
如果你不把[a-z1-9-]*放在你的正则表达式中,它不会删除名字中有数字或一些“-”的类。
您也可以使用Element.classList使用普通JavaScript来实现这一点。也不需要使用正则表达式:
函数removeColorClasses(元素) { for(让数组的className从(element.classList)) 如果(className.startsWith(“颜色”)) element.classList.remove(名称); }
注意:注意我们在开始之前创建了classList的Array副本,这很重要,因为classList是一个活跃的DomTokenList,它会在类被删除时更新。
我已经写了一个插件,做这个叫做alterClass -删除元素类通配符匹配。可选地添加类:https://gist.github.com/1517285
$( '#foo' ).alterClass( 'foo-* bar-*', 'foobar' )