有没有什么简单的方法来删除所有匹配的类,例如,

color-*

如果我有一个元素:

<div id="hello" class="color-red color-brown foo bar"></div>

去除后,它将是

<div id="hello" class="foo bar"></div>

谢谢!


当前回答

类似于@tremby的答案,这里是@Kobi的答案作为一个插件,将匹配前缀或后缀。

ex)剥离btn-mini和btn-danger,但当stripClass(“btn-”)时不剥离btn。 当stripClass('btn', 1)剥离马btn和牛btn,但不剥离btn-mini或btn

代码:

$.fn.stripClass = function (partialMatch, endOrBegin) {
    /// <summary>
    /// The way removeClass should have been implemented -- accepts a partialMatch (like "btn-") to search on and remove
    /// </summary>
    /// <param name="partialMatch">the class partial to match against, like "btn-" to match "btn-danger btn-active" but not "btn"</param>
    /// <param name="endOrBegin">omit for beginning match; provide a 'truthy' value to only find classes ending with match</param>
    /// <returns type=""></returns>
    var x = new RegExp((!endOrBegin ? "\\b" : "\\S+") + partialMatch + "\\S*", 'g');

    // https://stackoverflow.com/a/2644364/1037948
    this.attr('class', function (i, c) {
        if (!c) return; // protect against no class
        return c.replace(x, '');
    });
    return this;
};

https://gist.github.com/zaus/6734731

其他回答

$('div').attr('class', function(i, c){
    return c.replace(/(^|\s)color-\S+/g, '');
});

我已经写了一个插件,做这个叫做alterClass -删除元素类通配符匹配。可选地添加类:https://gist.github.com/1517285

$( '#foo' ).alterClass( 'foo-* bar-*', 'foobar' )

您也可以使用Element.classList使用普通JavaScript来实现这一点。也不需要使用正则表达式:

函数removeColorClasses(元素) { for(让数组的className从(element.classList)) 如果(className.startsWith(“颜色”)) element.classList.remove(名称); }

注意:注意我们在开始之前创建了classList的Array副本,这很重要,因为classList是一个活跃的DomTokenList,它会在类被删除时更新。

我有同样的问题,并提出了以下使用下划线的_。过滤方法。一旦我发现removeClass接受一个函数并为您提供一个类名列表,就很容易将其转换为一个数组并过滤掉类名以返回到removeClass方法。

// Wildcard removeClass on 'color-*'
$('[class^="color-"]').removeClass (function (index, classes) {
  var
    classesArray = classes.split(' '),
    removeClass = _.filter(classesArray, function(className){ return className.indexOf('color-') === 0; }).toString();

  return removeClass;
});

在单词边界上拆分正则表达式\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;
};