Événements JavaScript

Les événements HTML sont des choses qui arrivent aux éléments HTML.

JavaScript peut déclencher ces événements lorsqu'il est utilisé dans des pages HTML.


Événements HTML

Les événements HTML peuvent être des comportements de navigateur ou des comportements d'utilisateurs.

Voici des exemples d'événements HTML :

  • Le chargement de la page HTML est terminé

  • Modifications du champ de saisie HTML

  • Bouton HTML cliqué

Habituellement, lorsqu'un événement se produit, vous pouvez faire quelque chose.

JavaScript peut exécuter du code lorsqu'un événement est déclenché.

Des attributs d'événement peuvent être ajoutés aux éléments HTML et du code JavaScript peut être utilisé pour ajouter des éléments HTML.

Guillemets simples :

<some-HTML-element some-event='some JavaScript'>

Guillemets doubles :

<some-HTML-element some-event="some JavaScript">

Dans l'exemple suivant, l'attribut onclick est ajouté à l'élément bouton (et le code est ajouté) :

Exemple

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>
<button onclick="getElementById('demo').innerHTML=Date()">现在的时间是?</button>
<p id="demo"></p>
</body>
</html>

Dans l'exemple ci-dessus, le code JavaScript va modifier le contenu de l'élément id="demo" .

Exécutez le code et essayez-le

Dans la prochaine instance, le code modifiera le contenu de son propre élément (en utilisant this.innerHTML) :

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>
<button onclick="this.innerHTML=Date()">现在的时间是?</button>
</body>
</html>

Exécuter le code et essayez-le


Conseil : Le code JavaScript est généralement constitué de quelques lignes de code. Les plus courants sont appelés via les attributs d'événement :


Événements HTML courants

Ce qui suit est une liste de quelques événements HTML courants :

事件描述
onchangeHTML 元素改变
onclick用户点击 HTML 元素
onmouseover用户在一个HTML元素上移动鼠标
onmouseout用户从一个HTML元素上移开鼠标
onkeydown用户按下键盘按键
onload浏览器已完成页面的加载

Que peut faire JavaScript ?

Les événements peuvent être utilisés pour gérer la validation du formulaire, la saisie de l'utilisateur, le comportement de l'utilisateur et les actions du navigateur :

  • Déclenché lors du chargement de la page

  • Événement déclenché lorsque la page est fermée

  • L'utilisateur de l'événement clique sur le bouton pour effectuer une action

  • Vérifier la légalité de la saisie de l'utilisateur

  • Attendez...

Vous pouvez utiliser diverses méthodes pour exécuter le code d'événement JavaScript :

  • L'attribut d'événement HTML peut exécuter directement le code JavaScript

  • Les attributs d'événement HTML peuvent appeler des fonctions JavaScript

  • Vous pouvez spécifier vos propres gestionnaires d'événements pour les éléments HTML

  • Vous pouvez empêcher les événements de se produire.

  • Attendez...



Formation continue
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <button onclick="getElementById('demo').innerHTML=Date()">现在的时间是?</button> <p id="demo"></p> </body> </html>
soumettreRéinitialiser le code
  • Recommandations de cours
  • Téléchargement du didacticiel