Maison > Article > interface Web > Analyse détaillée de la description de l'événement natif js (code joint, simple et clair)
Voici les événements natifs js que j'ai compilés pour vous. Les étudiants intéressés peuvent y jeter un œil.
1. Flux d'événements
Le flux d'événements est principalement divisé en deux types : le bouillonnement d'événements et la capture d'événements. Les événements bouillonnent et l'élément cible reçoit l'événement en premier, puis se propage progressivement vers des nœuds moins spécifiques. La capture d'événements est exactement le contraire, l'idée principale est que les nœuds moins spécifiques reçoivent d'abord l'événement puis se propagent progressivement jusqu'au nœud cible.
Lorsqu'un div est cliqué, l'événement bouillonnant reçoit l'ordre des nœuds div->body->html->document
L'événement de capture reçoit l'ordre des nœuds document->html -> ;body->div
2. Gestionnaire d'événements
a) Gestionnaire d'événements HTML
Chaque événement pris en charge par un élément peut utiliser un HTML portant le même nom que les caractéristiques du gestionnaire d'événements correspondant pour spécifier.
Inconvénients : 1. Problème de décalage horaire, l'utilisateur peut avoir cliqué sur l'élément de page avant que le navigateur n'ait analysé la fonction d'événement de clic - enveloppez l'erreur via try-catch
2. La chaîne de portée du gestionnaire d'événements est différents navigateurs peuvent produire des résultats différents.
3. Le code HTML et le code Javascript sont étroitement couplés, ce qui n'est pas propice à l'expansion et à la maintenance.
b) Gestionnaire d'événements de niveau DOM0
Attribuez la fonction à l'attribut du gestionnaire d'événements d'élément
var btn = document.getElementById("#dv");
Gestionnaire d'événements pour supprimer des éléments – btn.onclicn = null
Spécifiez le gestionnaire d'événements addEventListener
Supprimez le gestionnaire d'événements RemoveEventListener
Recevez trois paramètres, à savoir le nom de l'événement à traiter, la fonction du gestionnaire d'événements, la valeur booléenne (true signifie appeler le gestionnaire dans la phase de capture, false signifie appeler le gestionnaire d'événements dans la phase de bouillonnement)
d)IE事件处理程序
attachEvent
detachEvent
两个方法接收相同的两个参数(”onclick”,”function(){}”);
由于IE8级更早版本只支持事件冒泡,所以通过attachEvent添加的事件处理程序只能被添加到冒泡阶段。
注意:attach中第一个参数是onclick而不是addEventListener中的click
IE事件处理程序attachEvent添加的在全局作用域中运行
var btn = document.getElementById(“#tes”); btn.attachEvent(“onclick”,function(){ alert(this == window); //true })
3、跨浏览器的事件处理程序。
由于不同浏览器之间事件处理程序不同,所以有必要编写可以跨浏览器使用的事件处理程序。
上面是我整理给大家的,希望今后会对大家有帮助。
相关文章:
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!