DOMTokenList.toggle()
Baseline
Widely available
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis juillet 2015.
La méthode toggle() (qui signifie basculer en anglais) de l'interface DOMTokenList supprime un jeton (token) donné de la liste et renvoie false. Si token n'existe pas, il est ajouté et la fonction renvoie true.
Syntaxe
tokenList.toggle(token [, force]);
Paramètres
- token
-
Une chaîne de caractères
DOMStringreprésentant le jeton que l'on veut activer ou désactiver. - force Facultatif
-
Un booléen qui, s'il est inclus, transforme la bascule en opération à un seul sens. Si ce paramètre vaut
false, le jeton sera seulement supprimé et aucun ajout ne suivra. S'il vauttrue, le jeton sera seulement ajouté et pas supprimé.
Valeur de retour
Un booléen qui vaut true ou false selon que le jeton se trouve dans la liste après l'exécution de la fonction ou non.
Exemples
Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément <span> en tant que DOMTokenList en utilisant Element.classList. Lors d'un clic sur le texte, nous remplaçons alors un jeton dans la liste et écrivons la liste dans le Node.textContent du <span>.
HTML
<span class="a b">classList vaut 'a b'</span>
JavaScript
let span = document.querySelector("span");
let classes = span.classList;
span.addEventListener("click", function () {
let result = classes.toggle("c");
if (result) {
span.textContent = `'c' ajouté ; classList vaut désormais "${classes}".`;
} else {
span.textContent = `'c' retiré ; classList vaut désormais "${classes}".`;
}
});
Résultat
Spécifications
| Specification |
|---|
| DOM # ref-for-dom-domtokenlist-toggle① |
Compatibilité des navigateurs
Chargement…