Heim >Web-Frontend >CSS-Tutorial >Wie entferne ich Klassen mit einem bestimmten Präfix in JavaScript?

Wie entferne ich Klassen mit einem bestimmten Präfix in JavaScript?

Linda Hamilton
Linda HamiltonOriginal
2024-11-28 02:19:101081Durchsuche

How to Remove Classes with a Specific Prefix in JavaScript?

So entfernen Sie Klassen mit einem bestimmten Präfix

Problemstellung

Sie haben ein div-Element mit der ID „a“, an das mehrere Klassen angehängt sind es, gruppiert nach bestimmten Präfixen. Sie möchten alle Klassen aus einer bestimmten Gruppe entfernen, ohne die spezifischen Klassennamen zu kennen. Beispielsweise möchten Sie alle „bg“-Präfixklassen eliminieren.

Lösung

Regex-Ansatz:

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

Loop-Ansatz :

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-Plugin (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-Alternative (sauberere Syntax):

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

Das obige ist der detaillierte Inhalt vonWie entferne ich Klassen mit einem bestimmten Präfix in JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn