删除以特定字符串开头的所有类

javascript jquery css

2022-08-30 05:37:49

我有一个div，它可能附加了任意数量的类，来自几个组。每个组都有一个特定的前缀。在javascript中，我不知道组中的哪个类在div上。我希望能够清除具有给定前缀的所有类，然后添加一个新类。如果我想删除所有以“bg”开头的类，我该怎么做？像这样的东西，但这实际上是有效的：id="a"

$("#a").removeClass("bg*");

答案 1

在字边界上进行正则表达式拆分不是最好的解决方案：\b

var prefix = "prefix";
var classes = el.className.split(" ").filter(function(c) {
    return c.lastIndexOf(prefix, 0) !== 0;
});
el.className = classes.join(" ").trim();

或作为 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 = $.trim(classes.join(" "));
    });
    return this;
};

2018 ES6 更新：

const prefix = "prefix";
const classes = el.className.split(" ").filter(c => !c.startsWith(prefix));
el.className = classes.join(" ").trim();

答案 2

使用jQuery，实际的DOM元素处于索引零，这应该有效

$('#a')[0].className = $('#a')[0].className.replace(/\bbg.*?\b/g, '');