Les événements en HTML sont des actions ou des occurrences qui se produisent sur un élément de page, comme un clic de souris, une pression sur une touche ou le chargement d'une page. Ces événements peuvent être gérés avec JavaScript pour effectuer des actions spécifiques.
Types d'événements
Il existe plusieurs types d'événements en HTML, notamment :
- Événements de la souris : clic, double-clic, mouvement de la souris, etc.
- Événements de clavier : comme appuyer sur une touche, relâcher une touche, etc.
- Événements de formulaire : comment soumettre un formulaire, modifier un champ de formulaire, etc.
- Événements de chargement : comme le chargement d'une page, le chargement d'une image, etc.
Gestion des événements avec JavaScript
Pour gérer les événements en HTML, vous devez utiliser JavaScript. JavaScript vous permet de définir des fonctions qui seront exécutées lorsqu'un événement spécifique se produit sur un élément de la page.
Par exemple, pour exécuter une fonction lorsqu'un bouton est cliqué, vous pouvez utiliser le code suivant :
<bouton onclick="maFonction()">Cliquez ici</bouton>
<script>
function maFonction() {
alert("Le bouton a été cliqué !");
}
</script>
Dans cet exemple, la fonction "myFunction()" sera exécutée lorsque le bouton sera cliqué. La fonction affiche une alerte avec le message "Le bouton a été cliqué !".
Continuez dans notre application.
Vous pouvez écouter le livre audio écran éteint, recevoir un certificat gratuit pour ce cours et accéder également à 5 000 autres cours en ligne gratuits.
Ou poursuivez votre lecture ci-dessous...
Téléchargez l'application
Ajouter des événements avec JavaScript
Il est également possible d'ajouter des événements avec JavaScript. Cela vous permet de définir des fonctions à exécuter lorsqu'un événement spécifique se produit sur un élément de la page, sans avoir à utiliser l'attribut "onclick".
Pour ajouter un événement avec JavaScript, vous pouvez utiliser la méthode "addEventListener()". Par exemple, pour exécuter une fonction lorsqu'un bouton est cliqué, vous pouvez utiliser le code suivant :
<identifiant du bouton="monBouton">Cliquez ici</bouton>
<script>
document.getElementById("myButton").addEventListener("click", myFunction);
function maFonction() {
alert("Le bouton a été cliqué !");
}
</script>
Dans cet exemple, la méthode "addEventListener()" est utilisée pour ajouter un événement de clic au bouton avec l'ID "myButton". La fonction "myFunction()" est définie comme la fonction à exécuter lorsque l'événement click se produit.
Conclusion
Les événements en HTML jouent un rôle important dans la création de pages Web interactives et dynamiques. Avec JavaScript, il est possible de gérer des événements pour effectuer des actions spécifiques lorsqu'un utilisateur interagit avec une page Web.
