Lorsqu'un événement se produit (par exemple l'événement click qui correspond au clic du bouton gauche de la souris), le gestionnaire d'événement correspondant est déclenché (dans notre exemple ce programme est nommé onclick). Si vous désirez que celui-ci produise un effet particulier, il suffira d'affecter à ce gestionnaire la fonction qui prend en charge cet événement.
Par exemple, vous voulez que lorsque l'on clique sur l'élément dont l'identifiant est élément1, une petite fenêtre affiche le message "Vous avez cliqué sur l'élément dont l'identifiant est élément1.". Alors, vous pouvez écrire dans votre fichier externe javascript.js le code suivant :
window.onload=gestevent;
function gestevent() {
document.getElementById("élément1").onclick=function() {
alert("Vous avez cliqué sur l'élément dont l'identifiant est élément1." );}
}
qui peut aussi s'écrire, par exemple, comme ceci :
window.onload=function () {
document.getElementById("élément1").onclick=function() {
alert("Vous avez cliqué sur l'élément dont l'identifiant est élément1." );}
}
Pour information, ces scripts externes produisent le même effet qu'un gestionnaire d'événement inséré dans la balise HTML considérée, c'est-à-dire :
<element id="élément1" onclick="alert('Vous avez cliqué sur l\'élément dont l\'identifiant est élément1.' )" ></element>