Parlez brièvement de la surveillance des événements en JavaScript

Cet article vous apporte des connaissances pertinentes sur javascript. Il organise principalement les problèmes liés à la surveillance des événements, y compris ce qu'est la surveillance des événements, comment configurer la surveillance des événements, etc.

【Recommandations associées : tutoriel vidéo javascript, front-end web】

Qu'est-ce que "l'écoute d'événements"

DOM nous permet d'écrire du code JS pour faire réagir les éléments HTML aux événements;

Événement : L'interaction entre l'utilisateur et la page Web ; ex : Cliquer sur la page Web

Écoute : Il s'agit de permettre à l'ordinateur de détecter que cet événement s'est produit à tout moment, afin de l'exécuter. certains programmes pré-écrits par le programmeur ;

définir les événements Il existe deux méthodes principales d'écoute : onxxx et addEventListener()

La manière la plus simple de définir l'écoute d'événements

Définir leurs attributs onxxx ; Surveillance courante des événements de souris

Nom de l'événement onclickondblclickonmousedownonmouseuponmousemove onmouseenteronmouseleaveSurveillance commune des événements du clavier

Description de l'événement
Lorsque la souris clique une fois sur un objet
Lorsque la souris double-clique sur un objet
Lorsqu'un bouton de la souris est enfoncé sur un objet Appuyez
Lorsqu'un bouton de la souris est relâché sur un objet
Lorsqu'un bouton de la souris est déplacé sur un objet
Lorsque la souris saisit un objet (événement similaire onmouseover)
Lorsque la souris quitte un objet (événement similaire onmouseout)

Nom de l'événement onkeypressonkeydownonkeyupSurveillance des événements sous forme commune

Description de l'événement
Lorsqu'une certaine touche du clavier est enfoncée (les boutons système tels que les touches fléchées et les touches de fonction ne peuvent pas être reconnus)
Lorsqu'une certaine touche du clavier est enfoncée (les boutons système peuvent Reconnu et se produira avant la pression sur la touche)
Lorsqu'une touche du clavier est relâchée

Nom de l'événementonchangeonfocusonbluronsubmitonresetSurveillance des événements de la page commune

Description de l'événement
Lorsque l'utilisateur modifie le contenu d'un champ de formulaire, cela déclenchera
Lorsqu'un élément obtient le focus (comme une touche de tabulation ou un clic de souris)
Lorsqu'un élément perd le focus
Lorsque le formulaire est soumis
Lorsque le formulaire est réinitialisé

Nom de l'événementenchargementau déchargementPropagation des événements

Description de l'événement
Lorsque le chargement de la page ou de l'image est terminé
Lorsque l'utilisateur quitte la page

D'abord de l'extérieur vers l'intérieur

(phase de capture), et puis encore De l'intérieur vers l'extérieur (étape de bouillonnement)

Cependant, avec onxxx écrit comme ceci (niveau DOM 0),

ne peut surveiller que l'étape de bouillonnement vous devez donc utiliser addEventListener(; ) méthode (DOM niveau 2);

oBox.onclick = function () {
    // 点击盒子时，将执行这里的语句
}

Notes

La plupart des
• éléments internes ne font plus la distinction entre les étapes de capture et de bouillonnement, le moniteur écrit à l'avant sera exécuté en premier, puis le moniteur écrit plus tard sera exécuté ;
Si Si vous définissez les mêmes deux événements ou plus avec le même nom pour un élément, la méthode d'écriture DOM niveau 0
• écrite plus tard écrasera le premier écrit au niveau DOM ; 2 seront exécutés dans l'ordre  ;
[Recommandation associée :

Tutoriel vidéo javascript

、front-end web】

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!