Événements JavaScript
Les événements HTML sont « choses » qui arrivent aux éléments HTML.
Lorsque JavaScript est utilisé dans des pages HTML, JavaScript peut
« réagir » sur ces événements.
Événements HTML
Un événement HTML peut être quelque chose que fait le navigateur ou quelque chose que fait un utilisateur.
Voici quelques exemples d’événements HTML :
- Une page Web HTML a fini de se charger
- Un champ de saisie HTML a été modifié
- Un bouton HTML a été cliqué
Souvent, lorsque des événements se produisent, vous voudrez peut-être faire quelque chose.
JavaScript vous permet d’exécuter du code lorsque des événements sont détectés.
HTML autorise les attributs de gestionnaire d’événements, avec du code Javascriptà ajouter aux éléments HTML.
Avec guillemets simples :
<élément
événement=‘du JavaScript‘>
Avec guillemets doubles :
<élément
événement=« du JavaScript« >
Dans l’exemple suivant, un onclick attribut (avec code), est ajouté à un
<button> élément:
Exemple
Essayez-le vous-même »
Dans l’exemple ci-dessus, le code JavaScript modifie le contenu de l’élément avec id= »demo ».
Dans l’exemple suivant, le code modifie le contenu de son propre élément (en utilisant this.innerHTML):
Exemple
Essayez-le vous-même »
Le code JavaScript fait souvent plusieurs lignes. Il est plus courant de voir des attributs d’événement appeler des fonctions :
Événements HTML courants
Voici une liste de certains événements HTML courants :
| Événement | Description |
|---|---|
| sur le changement | Un élément HTML a été modifié |
| sur clic | L’utilisateur clique sur un élément HTML |
| surmouseover | L’utilisateur déplace la souris sur un élément HTML |
| onmouseout | L’utilisateur éloigne la souris d’un élément HTML |
| onkeydown | L’utilisateur appuie sur une touche du clavier |
| en charge | Le navigateur a fini de charger la page |
La liste est bien plus longue : Infodewi JavaScript Reference HTML DOM Events.
Gestionnaires d’événements JavaScript
Les gestionnaires d’événements peuvent être utilisés pour gérer et vérifier les entrées de l’utilisateur, les actions de l’utilisateur et les actions du navigateur :
- Choses à faire à chaque fois qu’une page se charge
- Choses à faire lorsque la page est fermée
- Action à effectuer lorsqu’un utilisateur clique sur un bouton
- Contenu qui doit être vérifié lorsqu’un utilisateur saisit des données
- Et plus …
De nombreuses méthodes différentes peuvent être utilisées pour permettre à JavaScript de fonctionner avec des événements :
- Les attributs d’événement HTML peuvent exécuter directement du code JavaScript
- Les attributs d’événement HTML peuvent appeler des fonctions JavaScript
- Vous pouvez attribuer vos propres fonctions de gestionnaire d’événements aux éléments HTML
- Vous pouvez empêcher l’envoi ou la gestion d’événements
- Et plus …
Vous en apprendrez beaucoup plus sur les événements et les gestionnaires d’événements dans les chapitres HTML DOM.
#Événements #JavaScript