Explication détaillée des exemples de surveillance d'événements js

Définition de la surveillance des événements

En Javascript, les navigateurs sont généralement divisés en deux catégories :

① Navigateurs basés sur le noyau IE (navigateur IE avec numéro de version inférieur à 9 navigateur)

② Navigateur basé sur le noyau W3C (navigateur IE, Firefox, Google et autres navigateurs dont le numéro de version est supérieur à 9)

1) Syntaxe de base : Navigateur basé sur le noyau IE

dom object.attachEvent(type, callback, capture) : lier un écouteur d'événement à l'élément

Description du paramètre :

type : type d'événement lié, tel que onclick, onmouseover , onmouseout

callback : gestionnaire d'événements, généralement une fonction anonyme

capture : le modèle de navigateur utilisé, le modèle de bulle et le modèle de capture Par défaut, les navigateurs inférieurs à IE8 ne prennent en charge que le modèle de bulle !

?

1

1 2 3 4 5 6 7 8 9 10 11 12

//封装$函数，用于获取id的元素 function $(id){ return document.getElementById(id) } //绑定事件监听 $('btn').attachEvent('onclick',function(){ alert('hello') }); //二次绑定 $('btn').attachEvent('onclick',function(){ alert('world') });

2

3

4

5

6

7

8

9

10

11

12

//封装$函数，用于获取id的元素
function $(id){
    return document.getElementById(id)     
}
//绑定事件监听
$('btn').addEventListener('onclick',function(){
    alert('hello')
});
//二次绑定
$('btn').addEventListener('onclick',function(){
    alert('world')
});

2.

1 2 3 4 5 6 7 8 9 10 11 12

Syntaxe de base : écoute d'événements basée sur le noyau W3C dom object.addEventListener(type, callback) : écoute d'événements de liaison pour le navigateur du noyau W3C Description du paramètre : type : type d'événement de liaison, sans préfixe « on », tel que clic, survol de la souris, mouseoutrappel : gestionnaire d'événements, généralement une fonction anonyme

12 3 4 5 6 7 8 9 10 11 12

Résumé des différences dans la surveillance des événements

La méthode d'écoute du noyau IE et la méthode d'écoute du noyau W3C :

①Les méthodes sont différentes

La méthode d'écoute du noyau IE Le navigateur utilise attachEvent pour la liaison

Le navigateur principal du W3C utilise addEventListener pour la liaison

②Les paramètres sont différents

Le navigateur principal d'IE a trois méthodes de liaison. Paramètres type, rappel, capture (modèle de navigateur utilisé)

Navigateur du noyau W3C, sa méthode de liaison a deux paramètres au total, type et rappel

③les paramètres de type sont différents

Pour les navigateurs principaux d'IE, le type n'a pas besoin d'être préfixé par « on », comme onclick

Pour les navigateurs principaux du W3C, le type n'a pas besoin d'être préfixé par « on », comme click

④L'ordre de déclenchement est différent

Pour les navigateurs basés sur IE, la surveillance des événements est effectuée d'abord après la liaison, puis la liaison est déclenchée en premier.

Pour les navigateurs basés sur le W3C, la surveillance des événements est effectuée en premier. Liaison des déclencheurs d'abord, puis liaison des déclencheurs

Recommandations associées :

Explication détaillée des exemples d'utilisation de la surveillance des événements et de la publication d'événements dans Node.js

Introduction détaillée au plug-in de surveillance des événements de combinaison de touches JS

Explication détaillée de la surveillance et de l'utilisation des événements jQuery-mobile

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!