Explication détaillée du modèle d'événement JavaScript, des objets, de la surveillance et des exemples de code de livraison

1. Modèle d'événement

Événement bouillonnant (Bubbling) : les événements sont transmis des nœuds feuilles le long des nœuds ancêtres jusqu'au nœud racine
Événement de capture (Capture ) : De l'élément supérieur de l'arborescence DOM à l'élément le plus précis, par opposition aux événements bouillonnants
Modèle d'événement standard DOM : La norme DOM prend en charge à la fois les événements bouillonnants et les événements de capture, qui peuvent être considérés comme une combinaison des deux. , est d'abord le type de capture, puis les bulles à passer

2. Objet événement

Dans le navigateur IE, l'objet événement est un attribut de la fenêtre. . Dans le standard DOM, event doit être passé comme seul paramètre à la fonction de traitement d'événement

pour obtenir un objet événement compatible :

function(event){ 
  //event 是作为DOM标准的参数传入处理函数 
 event = event ?event : window.event; 
}

. Dans IE, l'objet événement est contenu dans le srcElement de l'événement, et dans le standard DOM, l'objet est contenu dans l'attribut cible
pour obtenir l'élément pointé par l'objet événement compatible :

var target =event.srcElement ? event.srcElement : event.target ;

à condition que, assurez-vous que l'objet événement a été correctement obtenu

3. Écouteur d'événement

Sous IE, les auditeurs enregistrés sont exécutés dans l'ordre inverse, c'est-à-dire que ceux enregistrés plus tard sont exécutés en premier

element.attachEvent('onclick',observer); //注册监听器
element.detachEvent('onclick',observer) //移除监听器

Le premier paramètre est le nom de l'événement et le deuxième paramètre est la fonction du gestionnaire de rappel

Sous standard DOM :

element.addEventListener('click',observer,useCapture) 
element.removeEventListener('click',observer,useCapture)

Le premier paramètre est le nom de l'événement sans le préfixe "on", le deuxième paramètre est la fonction de traitement de rappel , et le troisième paramètre indique si la fonction de rappel est appelée en phase de capture ou en phase de bouillonnement, la valeur par défaut est vraie pour la phase de capture

4. Livraison de l'événement

Annuler de manière compatible la livraison des événements du navigateur

function someHandler(event){ 
  event = event || window.event; 
  if(event.stopPropagation) //DOM标准 
  event.stopPropagation(); 
  else 
  event.cancelBubble = true; //IE标准 
}

Annuler le traitement par défaut après la livraison de l'événement

function someHandler(event){ 
  event = event || window.event; 
  if(event.preventDefault) //DOM标准 
  event. preventDefault (); 
  else 
  event.returnValue = true; //IE标准 
}

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!