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 中国語 Web サイトの他の関連記事を参照してください。