Comment basculer une classe d'éléments en javascript?

Le mot "basculer" signifie basculer entre les options. La bascule d'une classe d'éléments fait référence au changement d'une classe avec une autre classe. À cet effet, le basculer() la méthode est utilisée pour ajouter ou supprimer une classe. Il est utile pour afficher du contenu sur les pages Web. Il renvoie une vraie valeur si une classe y est ajoutée. Alors qu'il renvoie une fausse valeur pour supprimer une classe. De plus, les utilisateurs peuvent utiliser ajouter (), contenir (), et retirer() Méthodes pour basculer une classe d'élément. Dans le guide d'aujourd'hui, vous apprendrez à basculer une classe d'éléments en JavaScript de la manière suivante:

• Utilisation de la méthode toggle () en javascript
• Utilisation des méthodes Add (), Retirez () et contiens () en JavaScript

Comment basculer une classe d'éléments en javascript?

Comme d'autres langages de programmation, Javascrip Fournit une variété de fonctionnalités pour afficher le contenu sur les pages Web. Pour la visibilité du contenu du site Web, il utilise une fonctionnalité du basculer() méthode. La méthode prend une entrée du nom de la classe et la bascule à l'aide des éléments HTML.

Syntaxe

élément.liste de classe.Toggle (ClassName)

JavaScript peut basculer la classe de l'élément nom du cours en utilisant le liste de classe propriété. La propriété a mis à jour les données si la classe est supprimée ou ajoutée. En utilisant l'élément HTML, les utilisateurs peuvent explorer le basculer() méthode.

Méthode 1: Utilisation de la méthode toggle () en javascript

Un exemple est démontré en utilisant le basculer() Méthode en javascript.

Code

Un exemple de bascule une classe d'éléments en javascript

appuie sur le bouton
Bienvenue à JavaScript World.

La description du code ci-dessus est ici:

Un bouton nommé "appuie sur le bouton"Est attaché avec un myFunction () méthode. Dans cette méthode, une méthode Toggle () est utilisée en passant les propriétés de «style". Après avoir appuyé sur le bouton, la méthode toggle () est appelée et applique les propriétés de style au message "Bienvenue à JavaScript World".

Sortir

Avant d'appuyer sur le bouton:

Après avoir exécuté le code ci-dessus, la sortie affiche un bouton "appuie sur le bouton". De plus, un message s'affiche ici "Bienvenue à JavaScript World".

Après avoir appuyé sur le bouton:

Après avoir appuyé sur le bouton, le code JavaScript est exécuté sur le backend et bascule l'élément div à "style". Après cela, il est observé que divers styles sont inclus dans le div.

Méthode 2: Utilisation de méthodes Add (), retire () et contiend ()

Un autre exemple est adapté en utilisant les méthodes contenu (retirer () et ajouter () en javascript.

Code

Un autre exemple de bascule un élément de classe

Cliquez sur moi

Bienvenue à JavaScript World

La description du code est comme ci-dessous.

• Dans ce code, u_method () est utilisé pour obtenir l'élément HTML dans le p variable.
• Après cela, le contenir() la méthode est utilisée pour évaluer si la méthode est déclenchée ou non.
• S'il contient l'événement, utilisez le retirer() Méthode pour désactiver l'événement.
• Sinon, le ajouter() La méthode est utilisée pour ajouter l'événement à bascule.

Sortir

Avant d'appuyer sur le bouton:

Après avoir appuyé sur le bouton "Veuillez appuyer sur le bouton", Un élément de classe est basculé en utilisant le Ajouter enlever(), et contenir() Méthodes en JavaScript.

Après avoir appuyé sur le bouton:

En cliquant sur le "Veuillez appuyer sur le bouton" bouton, un message «Bienvenue dans JavaScript World» est affiché en utilisant le Ajouter enlever(), et contenir() Méthodes en JavaScript.

Conclusion

Basculement un classe d'élément est un processus d'ajout ou de suppression d'une classe en utilisant les éléments en JavaScript. Pour basculer une classe d'éléments en javascript, vous pouvez utiliser la méthode toggle () ou utiliser des méthodes add (), retire () et contenant (). La classe contient un ensemble de propriétés qui sont appliquées aux éléments.