Détails de la leçon
Description de la leçon
Dans cette leçon, nous allons explorer comment ajouter des modificateurs aux gestionnaires d'événements du DOM afin de modifier leur comportement de manière optimisée. Les modificateurs disponibles incluent :
- PreventDefault : Appelle Event.PreventDefault avant d'exécuter la fonction événementielle.
- StopPropagation : Appelle Event.StopPropagation pour éviter la propagation de l'événement.
- Passive : Améliore le scrolling pour les événements liés à la roulette de la souris ou aux écrans tactiles.
- Non Passive : Désactive le mode passif.
- Capture : Propage les événements vers les enfants au lieu des parents (capturing).
- Once : Exécute le gestionnaire une seule fois.
- Self : Exécute le gestionnaire uniquement si Event.Target est égal à l'élément déclencheur.
- Trusted : Exécute le gestionnaire si Event.Trusted vaut true (événement déclenché par l'utilisateur).
Nous illustrerons également ces concepts avec un exercice pratique de formulaire, où nous ajouterons un bouton submit pour calculer le carré d'un nombre sans changer de page, grâce au modificateur preventDefault.
Objectifs de cette leçon
Comprendre et utiliser les modificateurs des gestionnaires d'événements DOM pour contrôler les interactions utilisateur.
Prérequis pour cette leçon
Connaissance de base du DOM et des événements en JavaScript.
Métiers concernés
Développeur web, Ingénieur logiciel, Spécialiste en interfaces utilisateur.
Alternatives et ressources
Utilisation de bibliothèques JavaScript comme jQuery ou React pour la gestion des événements.