Gérer les classes

Objectif

Ajouter et retirer des classes CSS avec classList.

Contexte

classList permet de gérer les classes d'un élément :

const bouton = document.querySelector("button")

// Ajouter une classe
bouton.classList.add("actif")

// Retirer une classe
bouton.classList.remove("desactive")

// Basculer (ajoute si absente, retire si présente)
bouton.classList.toggle("visible")

// Vérifier si une classe existe
bouton.classList.contains("actif")  // true

Pourquoi classList ?

Consigne

1. Ajoute la classe "highlight" à la carte
2. Ajoute la classe "active" à la carte
3. Retire la classe "visible"

Résultat attendu :

• La carte devient jaune (highlight) et légèrement agrandie (active)
• La console affiche les classes avant et après modification