Événements HTML sont des «choses» qui se produisent en HTML éléments.
Lorsque JavaScript est utilisé dans les pages HTML, JavaScript peut «réagir» sur ces événements.
HTML Evénements
Un événement HTML peut être quelque chose que le navigateur ne, ou quelque chose d'un utilisateur fait.
Voici quelques exemples d'événements HTML:
- Une page HTML Web a terminé le chargement
- Un champ de saisie HTML a été modifié
- Un bouton HTML a été cliquée
Souvent, lorsque les é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 permet gestionnaire d'attributs d' événement, avec le code JavaScript, à ajouter aux éléments HTML.
Avec des guillemets simples:
< some-HTML-element
some-event = ' some JavaScript ' >
Avec des guillemets doubles:
< some-HTML-element
some-event = " some JavaScript " >
Dans l'exemple suivant, un onclick attribut (avec le code), est ajouté à un élément de bouton:
Exemple
<button onclick='getElementById("demo").innerHTML=Date()'>The time is?</button>
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 change le contenu de son propre élément ( en utilisant this .innerHTML ):
code JavaScript est souvent plusieurs lignes. Il est plus fréquent de voir des attributs d'événement appelant des fonctions:
HTML Common Events
Voici une liste de certains événements HTML communs:
un événement | La description |
---|---|
onchange | Un élément HTML a été changé |
onclick | L'utilisateur clique sur un élément HTML |
onmouseover | L'utilisateur déplace la souris sur un élément HTML |
onmouseout | L'utilisateur déplace la souris en dehors d'un élément HTML |
onkeydown | L'utilisateur appuie sur une touche du clavier |
onload | Le navigateur a fini de charger la page |
La liste est beaucoup plus longue: w3ii Référence JavaScript HTML DOM Events .
Que peut JavaScript faire?
Les gestionnaires d'événements peuvent être utilisés pour traiter et vérifier l'entrée d'utilisateur, les actions des utilisateurs, et les actions du navigateur:
- Les choses qui devraient être faites à chaque fois qu'une page se charge
- Les choses qui devraient être faites lorsque la page est fermée
- Action qui doit être effectuée lorsque l'utilisateur clique sur un bouton
- Contenu qui doit être vérifié lorsque les données des entrées de l'utilisateur
- Et plus ...
De nombreuses méthodes différentes peuvent être utilisées pour laisser travailler JavaScript avec des événements:
- les attributs d'événements HTML peuvent exécuter du code JavaScript directement
- les attributs d'événements HTML peuvent appeler des fonctions JavaScript
- Vous pouvez attribuer vos propres fonctions de gestionnaire d'événements en HTML éléments
- Vous pouvez empêcher que des événements soient envoyés ou être manipulés
- Et plus ...
Vous apprendrez beaucoup plus sur les événements et les gestionnaires d'événements dans les HTML DOM chapitres.
Testez-vous avec des exercices!
Exercice 1 » Exercice 2» Exercice 3 »