Dieser Artikel zeigt die Ansätze zum Überprüfen, ob ein Körper eine bestimmte Klasse mit JavaScript hat.
Wie überprüfe ich mit JavaScript, ob Body eine bestimmte Klasse hat?
Wenden Sie die folgenden Ansätze an, um mit JavaScript zu überprüfen, ob ein Körper eine bestimmte Klasse hat:
- „ Klassenliste „Eigentum und“ enthält() ' Methode.
- „ getElementsByTagName() ' und ' passen() “Methoden.
- „ jQuery “.
Lassen Sie uns jeden der Ansätze einzeln veranschaulichen!
Ansatz 1: Überprüfen Sie, ob Body eine bestimmte Klasse in JavaScript hat, indem Sie die classList-Eigenschaft und die contains()-Methode verwenden
Das ' Klassenliste ”-Eigenschaft gibt die CSS-Klassennamen eines Elements an. Während die ' enthält() “-Methode ergibt true, wenn ein Knoten ein Nachkomme ist. Diese kombinierten Methoden können angewendet werden, um auf die enthaltene Klasse im zugeordneten Element zuzugreifen.
Syntax
Knoten. enthält ( nackt )
In der obigen Syntax:
- „ nackt ” entspricht dem Knotennachkommen des zugehörigen Knotens.
Beispiel
Lassen Sie uns einen Überblick über das unten angegebene Beispiel geben:
< Center >< Karosserie Klasse = 'enthalten' >
< h2 > Dies ist die Linuxhint-Website h2 >
Center > Karosserie >
< Skripttyp = 'text/javascript' >
wenn ( dokumentieren. Karosserie . Klassenliste . enthält ( 'enthalten' ) ) {
Konsole. Protokoll ( 'Das Körperelement hat Klasse' ) ;
}
anders {
Konsole. Protokoll ( 'Das Körperelement hat keine Klasse' ) ;
}
Skript >
Wenden Sie die unten angegebenen Schritte an, wie im obigen Code angegeben:
- Fügen Sie zunächst ein „
„Element mit dem set-Attribut“ Klasse “. - Fügen Sie außerdem innerhalb des jeweiligen Elements ( ) eine Überschrift hinzu.
- Wenden Sie im JS-Code das „ Klassenliste ” Eigenschaft kombiniert mit der “ enthält() ' Methode.
- Dadurch wird der Zugriff auf die Klasse des zugehörigen „
”-Element basierend auf dem angegebenen Klassennamen im Parameter der Methode. - Bei erfüllter Bedingung wird die „ wenn ” Bedingung wird ausgeführt.
- Im Gegensatz dazu ist die „ anders ”-Anweisungscodeblock wird ausgeführt.
Ausgabe
In der obigen Ausgabe ist ersichtlich, dass die jeweilige Klasse in der „
Ansatz 2: Überprüfen Sie, ob Body eine bestimmte Klasse in JavaScript hat, indem Sie die Methoden getElementsByTagName() und match() verwenden
Das ' getElementsByTagName() ”-Methode liefert eine Sammlung aller Elemente mit einem bestimmten Tag-Namen. Das ' passen() ”-Methode gleicht den angegebenen Wert mit der Zeichenfolge ab. Diese Methoden können verwendet werden, um auf das erforderliche Element über sein Tag zuzugreifen und nach der spezifischen Klasse zu suchen.
Syntax
dokumentieren. getElementsByTagName ( Schild )In der bereitgestellten Syntax:
- „ Schild “ steht für den Tag-Namen des Elements.
Beispiel
Das folgende Beispiel demonstriert das diskutierte Konzept:
< img src = 'template2.png' Höhe = '150px' Breite = '150px' >
Center > Karosserie >
< Skripttyp = 'text/javascript' >
Lassen erhalten = dokumentieren. getElementsByTagName ( 'Karosserie' ) [ 0 ] . Klassenname . passen ( /enthält/ )
wenn ( erhalten ) {
Konsole. Protokoll ( 'Das Körperelement hat Klasse' ) ;
}
anders {
Konsole. Protokoll ( 'Das Körperelement hat keine Klasse' ) ;
}
Skript >
Im obigen Code-Snippet:
- Fügen Sie ebenso ein „
” Element mit der angegebenen Klasse. - Fügen Sie außerdem ein Bild mit den festgelegten Abmessungen innerhalb des im vorherigen Schritt angegebenen Elements hinzu.
- Greifen Sie in den JavaScript-Codezeilen auf „
”-Element durch sein Tag mit dem “ getElementsByTagName() ' Methode. - Das ' [0] “ gibt an, dass das erste Element, das dem angegebenen Tag im vorherigen Schritt entspricht, abgerufen wird.
- Das ' Klassenname „Eigentum und die“ passen() “-Methode wird für die angegebene Klasse in ihrem Parameter mit der „
' Element. - Die frühere Aussage im „ wenn ” Bedingung wird ausgeführt, wenn alle Bedingungen in den vorherigen Schritten erfüllt sind.
- Andernfalls wird letztere Anweisung angezeigt.
Ausgabe
Die obige Ausgabe zeigt an, dass die angewendete Bedingung für eine bestimmte Klasse erfüllt ist.
Ansatz 3: Überprüfen Sie, ob Body eine bestimmte Klasse in JavaScript hat, indem Sie jQuery verwenden
Dieser Ansatz kann implementiert werden, um direkt auf das erforderliche Element zuzugreifen und die spezifische Klasse dagegen mit Hilfe seiner Methode einfach zu lokalisieren.
Beispiel
Gehen wir das unten angegebene Beispiel durch:
< Center >< Karosserie Klasse = 'enthält' >
< textarea-Platzhalter = 'Geben Sie einen beliebigen Text ein...' > Textbereich >
Center > Karosserie >
wenn ( $ ( 'Karosserie' ) . hatKlasse ( 'enthält' ) ) {
Alarm ( 'Das Körperelement hat Klasse' )
}
anders {
Alarm ( 'Das Körperelement hat keine Klasse' )
}
Skript >
In den obigen Codezeilen:
- Umfassen die ' jQuery ”-Bibliothek, um ihre Funktionalitäten zu nutzen.
- Fügen Sie in ähnlicher Weise das „
” Element mit der angegebenen Klasse. - Fügen Sie außerdem ein „
”-Element innerhalb des angegebenen Elements im vorherigen Schritt. - Greifen Sie im JS-Code auf „
' Element. Wenden Sie auch das „ hatKlasse() ”-Methode, um im abgerufenen Element nach der angegebenen Klasse zu suchen. - Dies wird als Ergebnis die frühere Nachricht auf die erfüllte Bedingung aufmerksam machen.
- Im anderen Fall wird die letztere Anweisung angezeigt.
Ausgabe
Die obige Ausgabe impliziert, dass die gewünschte Anforderung erfüllt ist.
Fazit
Das ' Klassenliste „Eigentum und“ enthält() “-Methode, die „ getElementsByTagName() ' und ' passen() “ Methoden oder die „ jQuery “ kann verwendet werden, um mithilfe von JavaScript zu überprüfen, ob ein Körper eine bestimmte Klasse hat. Diese Ansätze können verwendet werden, um nach der bestimmten Klasse innerhalb eines Elements zu suchen, indem Sie direkt auf das entsprechende Element verweisen, über sein Tag oder die jQuery-Methode verwenden. In diesem Blog wurde erklärt, wie man überprüft, ob ein Körper eine bestimmte Klasse in JavaScript hat