Rendre une page web interactive avec JavaScript

Une page web est comme une maison : HTML construit les murs, CSS choisit la peinture et JavaScript ajoute les interrupteurs. Grâce à JavaScript, un clic sur un bouton peut changer un texte, afficher un message ou ouvrir un menu. Sans JavaScript, la page reste surtout statique : on peut la lire, mais elle réagit peu. JavaScript s’exécute dans le navigateur, sur l’ordinateur ou le téléphone de l’utilisateur. On l’écrit souvent dans un fichier .js relié à la page HTML.

Un événement est une action repérée par le navigateur : clic, touche du clavier, survol de la souris. Pour réagir, on sélectionne un élément puis on lui associe une fonction avec addEventListener. La fonction contient les instructions à exécuter au moment de l’événement. Par exemple, cliquer sur un bouton peut afficher une alerte ou modifier un texte. Le navigateur attend l’événement, puis lance la fonction automatiquement.

Le DOM est la représentation de la page HTML que JavaScript peut lire et modifier. On sélectionne un élément avec querySelector, puis on agit sur ses propriétés. textContent change le texte, classList ajoute ou retire une classe CSS, et style modifie directement une apparence. Ces modifications sont immédiates dans le navigateur, sans recharger la page. C’est ainsi qu’un menu s’ouvre ou qu’un mode sombre s’active.

Avec des variables et des conditions, JavaScript peut prendre des décisions. Une variable const garde une valeur, et if vérifie une condition avant d’exécuter du code. Par exemple, on peut afficher « Bonjour » seulement si le visiteur a écrit son prénom. Pour vérifier ce qui se passe, on utilise console.log et la console du navigateur. En cas d’erreur, il faut lire le message, corriger l’orthographe des noms et tester à nouveau.