Méthode HTML DOMTokenList toggle()

Définition et utilisation

La méthode toggle() supprime le marqueur donné de la liste et retourne false. Si le marqueur n'existe pas, il l'ajoute et retourne true.

Exemple

Exemple 1

Basculer l'état ouvrir/fermer de "myStyle" :

const list = element.classList;
list.toggle("mywStyle");

Essayer par vous-même

Exemple 2

Ajouter la classe "myStyle" à l'élément :

const list = element.classList;
list.add("myStyle");

Essayer par vous-même

Exemple 3

Supprimer la classe "myStyle" de l'élément :

const list = element.classList;
list.remove("myStyle");

Essayer par vous-même

Exemple 4

Ajouter plusieurs classes à un élément :

element.classList.add("myStyle", "anotherClass", "thirdClass");

Essayer par vous-même

Exemple 5

Supprimer plusieurs classes d'un élément :

element.classList.remove("myStyle", "anotherClass", "thirdClass");

Essayer par vous-même

Exemple 6

Obtenir le nombre de classes d'un élément :

let numb = element.classList.length;

Essayer par vous-même

Exemple 7

Basculer entre les classes pour créer un bouton déroulant :

document.getElementById("myBtn").onclick = function() {myFunction()};
function myFunction() {
  document.getElementById("myDropdown").classList.toggle("show");
}

Essayer par vous-même

Syntaxe

domtokenlist.toggle(token)

Paramètres

Paramètres Description
token Obligatoire. Le marqueur à basculer.

Valeur de retour

Aucun.

Prise en charge du navigateur

domtokenlist.toggle() est une caractéristique du niveau DOM 4 (2015).

Il est pris en charge par tous les navigateurs :

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Pris en charge Pris en charge Pris en charge Pris en charge Pris en charge

Internet Explorer 11 (ou versions antérieures) ne prend pas en charge domtokenlist.toggle().

Pages associées

Propriété length

Méthode item()

Méthode add()

Méthode remove()

Méthode replace()

Méthode forEach()

Méthode entries()

Méthode keys()

Méthode values()

Objet DOMTokenList