首页 >web前端 >css教程 >如何在 JavaScript 中删除具有特定前缀的类?

如何在 JavaScript 中删除具有特定前缀的类?

Linda Hamilton
Linda Hamilton原创
2024-11-28 02:19:101085浏览

How to Remove Classes with a Specific Prefix in JavaScript?

如何删除具有特定前缀的类

问题陈述

您有一个 ID 为“a”的 div 元素,其中附加了多个类它按特定前缀分组。您想要从某个组中删除所有类,但不知道具体的类名称。例如,您的目标是消除所有“bg”前缀类。

解决方案

正则表达式方法:

var prefix = "bg";
var classes = $("#a").attr("class").split(" ").filter(function(c) {
    return !(c.match("^" + prefix + "\b"));
});
$("#a").attr("class", classes.join(" "));

循环方法:

var prefix = "bg";
var classes = $("#a").attr("class").split(" ");
for (var i = 0; i < classes.length; i++) {
    if (classes[i].startsWith(prefix)) {
        classes.splice(i, 1);
        i--;
    }
}
$("#a").attr("class", classes.join(" "));

jQuery 插件 (ES5):

$.fn.removeClassPrefix = function(prefix) {
    return this.each(function() {
        var classes = $(this).attr("class").split(" ").filter(function(c) {
            return !c.startsWith(prefix);
        });
        $(this).attr("class", classes.join(" "));
    });
};

$("#a").removeClassPrefix("bg");

ES6 替代方案(更简洁的语法):

const prefix = "bg";
const classes = $("#a").attr("class").split(" ").filter(c => !c.startsWith(prefix));
$("#a").attr("class", classes.join(" "));

以上是如何在 JavaScript 中删除具有特定前缀的类?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn