L’interactivité repose sur les événements : des actions de l’utilisateur (clic, survol, frappe au clavier) auxquelles votre code peut réagir.
Quelques événements courants
- click — l’utilisateur clique sur un élément.
- mouseover — la souris survole un élément.
- keydown — une touche du clavier est enfoncée.
Écouter un événement
On relie une réaction à un élément avec addEventListener :
const bouton = document.querySelector("button");
bouton.addEventListener("click", function() {
alert("Vous avez cliqué !");
});
Le principe est simple : « quand cet événement se produit sur cet élément, exécute cette fonction ». La fonction fournie s’appelle une fonction de rappel (callback).
À retenir :
addEventListenerpermet de réagir aux actions de l’utilisateur. C’est le cœur de l’interactivité d’une page.