événement HTML DOM
HTML DOM permet événements JavaScript de réagir à HTML.
Exemples
Réagir aux événements
Lorsqu'un événement se produit, vous pouvez exécuter JavaScript, tel que lorsqu'un utilisateur clique sur un élément HTML.
Pour exécuter du code lorsque l'utilisateur clique sur un élément, ajoutez le code JavaScript à l'HTML attributs d'événement:
Exemples d'événements HTML:
- Lorsque l'utilisateur clique sur la souris
- Lorsque la page est chargée
- Lorsque l'image est chargée
- Lorsque la souris se déplace sur l'élément
- Lorsque le champ d'entrée est changé
- Lorsque le formulaire HTML est soumis
- Lorsque l'utilisateur déclenche la clé
Dans cet exemple, lorsqu'un utilisateur clique sur, il va changer le contenu de <h1> élément:
Exemples
<html>
<body>
<h1 onclick="this.innerHTML='Ooops!'">Click on this text!</h1>
</body>
</html>
Essayez »
Dans ce cas, la fonction sera appelée à partir du gestionnaire d'événements:
Exemples
<html>
<head>
<script>
function changetext(id)
{
id.innerHTML="Ooops!";
}
</script>
</head>
<body>
<h1 onclick="changetext(this)">Click on this text!</h1>
</body>
</html>
Essayez »
Attributs HTML événement
Pour affecter des événements au format HTML éléments, vous pouvez utiliser les attributs de l'événement.
Exemples
Assigné à l'élément de bouton un événement onclick:
Essayez »
Dans l'exemple ci-dessus, lorsque le bouton est cliqué, il exécute la fonction nommée displayDate.
Utilisez le DOM HTML pour attribuer un événement
événement DOM HTML vous permet d'utiliser JavaScript pour affecter des éléments HTML:
Exemples
Assigné onclick élément bouton d'événement:
document.getElementById("myBtn"). onclick =function(){ displayDate() };
</script>
Essayez »
Dans l'exemple ci-dessus, la fonction nommée displayDate sont affectés à l'id = myButn "élément HTML.
Lorsque le bouton est cliqué, l'exécution de la fonction.
onload et événement onunload
Quand un utilisateur entre ou quitte la page, il va déclencher onload et l'événement onunload.
événement onload peut être utilisé pour vérifier les visiteurs le type de navigateur et la version en ordre basé sur les informations à charger différentes versions d'une page.
onload et onunload événement pour la manipulation des cookies.
événement onchange
événement onchange est souvent utilisé pour valider le champ de saisie.
L'exemple suivant montre comment utiliser onchange. Lorsque l'utilisateur modifie le contenu du champ de saisie sera appelée fonction upperCase ().
onmouseover et onmouseout événements
onmouseover et onmouseout événements peuvent être utilisés pour déclencher des fonctions lorsque le pointeur de la souris se déplace dans ou hors des éléments.
onmousedown, onmouseup et événement onclick
onmousedown, onmouseup onclick événement est un clic de souris et l'ensemble du processus. Tout d'abord, quand un bouton de la souris est cliqué, déclencher onmousedown événement, puis, lorsque le bouton de la souris est relâché, il va déclencher onmouseup événement, et enfin, lorsque la souris cliquez sur Terminer, l'événement onclick est déclenché.
HTML DOM Event Object Reference
Pour une description complète et des exemples de chaque événement, s'il vous plaît visitez notre manuel de référence DOM HTML .