Klassenliste für Element mit jQuery abrufen

Question

Gibt es eine Möglichkeit in jQuery zu Schleife durch oder weisen Sie ein Array alle Klassen, die ein Element zugeordnet sind?

ex.

<div class="Lorem ipsum dolor_spec sit amet">Hello World!</div>

Ich werde nach einer "speziellen" Klasse wie in "dolor_spec" oben suchen. Ich weiß, dass ich hasClass() verwenden könnte, aber der tatsächliche Klassenname muss nicht unbedingt zu diesem Zeitpunkt bekannt sein.

Answer 1

var classList = $(element).attr('class').split(/\s+/);
$(classList).each(function(index){

     //do something

});

Answer 2

$('div').attr('class').split(' ').each(function(cls){ console.log(cls);})

Answer 3

Aktualisierung:

Wie @Ryan Leonard richtig bemerkte, behebt meine Antwort nicht wirklich den Punkt, den ich selbst gemacht habe... Sie müssen sowohl trimmen als auch doppelte Leerzeichen mit (zum Beispiel) string.replace(/ +/g, " "). entfernen. Oder Sie könnten den el.className aufteilen und dann leere Werte mit (zum Beispiel) arr.filter(Boolean) entfernen.

const classes = element.className.split(' ').filter(Boolean);

oder moderner

const classes = element.classList;

Alt:

Bei all den gegebenen Antworten sollten Sie nie vergessen, .trim() (oder $.trim()) zu verwenden.

Da Klassen hinzugefügt und entfernt werden, kann es vorkommen, dass zwischen den Klassenstrings mehrere Leerzeichen stehen, z. B. 'class1 class2 class3'.

Dies würde zu ['class1', 'class2','','','', 'class3']. führen.

Wenn Sie Trimmen verwenden, werden alle mehrere Leerzeichen werden entfernt..

Answer 4

Vielleicht kann dies auch Ihnen helfen. Ich habe diese Funktion verwendet, um Klassen von Kinderelementen zu erhalten

function getClickClicked(){
    var clickedElement=null;
    var classes = null;<--- this is array
    ELEMENT.on("click",function(e){//<-- where element can div,p span, or any id also a class
        clickedElement = $(e.target);
        classes = clickedElement.attr("class").split(" ");
        for(var i = 0; i<classes.length;i++){
            console.log(classes[i]);
        }
        e.preventDefault();
    });
}

In Ihrem Fall wollen Sie doler_ipsum Klasse können Sie wie folgt jetzt tun calsses[2]; .

Answer 5

Um die Liste der auf ein Element angewendeten Klassen zu erhalten, können wir verwenden

$('#elementID').prop('classList')

Um Klassen hinzuzufügen oder zu entfernen, können wir wie folgt vorgehen.

$('#elementID').prop('classList').add('yourClassName')
$('#elementID').prop('classList').remove('yourClassName')

Und um einfach zu prüfen, ob die Klasse vorhanden ist oder nicht, können wir hasClass