Question

嗨，我有一个li元素，它将有一些与此相关的声明

<li class="module ui-helper-fix">

我可以通过添加类（通过DB调用动态提供）动态更改模块的颜色，最终结果是

<li class="module ui-helper-fix module-green">

或

<li class="module ui-helper-fix module-default">

我可以通过添加一个新的模块WHATEVER类来改变颜色，但我想要做的是删除任何匹配module-XXXX的类，所以它从一个干净的平板开始，然后在类模块上添加-crimson。

那么如何首先删除所有与module-xxx匹配的类？请记住，我不想删除基本模块类。

编辑：

我基本上需要在任何模块类上执行干净扫描的方法：

执行前

<li class="module ui-helper-fix module-default">

清洁扫描后

<li class="module ui-helper-fix">

然后添加班级和最终结果

<li class="module ui-helper-fix module-green">

感谢。

-Seth

Answer 1

更新

DEMO： http://jsbin.com/onoxa/7

DEMO 2： http://jsbin.com/onoxa/8

$(function() {
    $("li").each(function(e) {     
    var classes = this.className.replace(/module-\w+/gi, '' );
        $(this).attr('class', classes);
    });
});

$("li").each(function(e) {
    var classes = this.className.replace(/module-\w+/gi, '');
    $(this).attr('class', classes + ' module-green');

});

输出这个：

<li class="module ui-helper-fix">

Answer 2

使用此：

var newClass = "module-green";
$("li").attr("class","module ui-helper-fix").addClass(newClass);

Answer 3

function changeModule(selector, module_name) {
    var that = selector;
    var classes = $(selector).attr('class').split(' ');
    $.each(classes, function(index, thisClass){
        if (thisClass.indexOf('module-') !== -1) {
            $(that).removeClass(classes[index])
        }
    });
    $(that).addClass(module_name);
}

jQuery(document).ready(function(){ 
    $('li').click(function(){
        changeModule(this, 'module-green');
    })
});

Answer 4

也许这只是一个旧帖子，但是从jQuery 1.4开始，你可以提供matching function to .removeClass()

示例：http://jsfiddle.net/drzaus/MJdRy/

$('.module')
    .removeClass(function(i,c) {
        return c.match(/module-\w+/gi).join(' ');
    })
    .addClass('module-green');

基于answer here

它看起来比accepted answer更笨拙，但它是“jQuery方式”。

删除jQuery中的所有匹配类

4 个答案: