← Retour au programme
Module 04

JavaScript : interagir avec le navigateur

Rendez vos pages vivantes en manipulant le DOM et en réagissant aux actions de l'utilisateur.

Apprenez les bases de JavaScript dans le navigateur : sélectionner des éléments, modifier leur contenu et écouter les événements.

Module suivant →

Philosophie

La pratique est la clé. Codez en même temps que vous lisez.

Prérequis & Outils

  • HTML et CSS de base
  • Fondamentaux de la programmation
JavaScriptDOMÉvénements

Objectifs du module

  • ✦Manipuler le DOM
  • ✦Gérer les événements
  • ✦Créer des interfaces interactives

Ressource complémentaire

JavaScript Tutorial for Beginners

Introduction claire et concise à JavaScript.

Contenu du module

Progression pas à pas.

Chaque leçon s'appuie sur la précédente avec un rythme pensé pour laisser de l'espace à la compréhension, à la pratique et à la révision.

Leçon 1

Le Document Object Model (DOM)

Comprendre comment JavaScript interagit avec la page web.

Le DOM est une représentation en mémoire de votre page HTML.

Vous pouvez utiliser document.querySelector pour trouver des éléments.

Modifiez textContent ou style pour changer l'apparence.

Sélectionner et modifier un élémentjavascript
const title = document.querySelector('h1');
title.textContent = 'Bonjour le monde';

Exercice pratique

Changer le texte

Modifiez le texte de l'élément avec l'id 'message'.

  1. Sélectionnez l'élément
  2. Modifiez son textContent

✓Le texte a bien été modifié.

Projet final

Tableau de bord interactif

Construisez un compteur interactif avec des boutons + et -.

Critères de réussite

  • ✓L'état est conservé dans une variable
  • ✓L'affichage se met à jour
  • ✓Les événements sont gérés proprement

Guide de réalisation

  • 1Créez une variable let count
  • 2Ajoutez des event listeners aux boutons

Consolidez vos acquis avant de poursuivre.

Prenez le temps de revoir les concepts difficiles et de refaire les exercices qui méritent une seconde passe.

← Module précédentModule suivant →