DébutantNon commencé

Exercice 6.6 · 10 min · 0 tentative

Bouton interactif

Objectif

Créer un bouton qui change de couleur quand on clique dessus.

Contexte

En JavaScript, on peut réagir aux actions de l'utilisateur grâce aux événements. L'événement click se déclenche quand l'utilisateur clique sur un élément.

// Structure générale
element.addEventListener('click', function() {
  // Code exécuté au clic
})

Modifier le style en JavaScript

// Changer la couleur de fond
element.style.backgroundColor = 'red'

// Changer la couleur du texte
element.style.color = 'white'

Consigne

  1. Sélectionne le bouton avec querySelector
  2. Ajoute un écouteur d'événement click
  3. Au clic, change la couleur du bouton en vert
  4. Mets à jour le message pour afficher "Le bouton est vert !"

Résultat attendu :

  • Au départ : bouton bleu avec le message "Le bouton est bleu"
  • Après clic : bouton vert avec le message "Le bouton est vert !"

Objectifs

  • Utiliser addEventListener
  • Changer la couleur en vert
  • Afficher 'Le bouton est vert'
  • Bouton existe

Lisez bien les instructions et lancez-vous !

Indices (0/3)

Indice 1 verrouillé
Indice 2 verrouillé
Indice 3 verrouillé