addEventListener 如何在后台工作

How does addEventListener work under the hood?

本文关键字:后台 工作 addEventListener      更新时间:2023-09-26
var elem=document.getElementById('mydiv');
elem.addEventListener('click',function(){...});

执行上述代码后,elemHTMLDivElement 接口的一个实例。我最大的问题是addEventListener((方法到底是做什么的。它在哪些 DOM 对象中注册侦听器以及如何注册(它更改了这些 DOM 对象的哪些属性(。换句话说,我想知道elem如何被告知添加侦听器,它的哪些属性(所有属性都归结为其原型链(受到影响。例如,我知道 Event.prototype 具有至关重要的属性,例如 typetarget ;但是我无法将它们与elem"连接"......

我不想找到哪些事件侦听器附加到上面的 DOM 节点。我想知道内部程序。

谢谢

执行上述代码后,elem 是HTMLDivElement接口的实例。我最大的问题是addEventListener()方法究竟有什么作用。

它在哪些 DOM 对象中注册侦听器

在调用addEventListener的 DOM 元素上。(当然,子元素上的事件可能会冒泡(。

以及它是如何做到这一点的(它改变了这些 DOM 对象的哪些属性(

它是如何做到这一点的是一个内部实现细节。它不会更改 DOM 对象的用户可见属性。

换句话说,我想知道 elem 是如何被告知添加侦听器的

不是。

它的哪些属性(所有属性都包括其原型链(受到影响

都不是。

例如,我知道 Event.prototype 具有诸如类型、目标等关键属性;但是我无法将它们与 elem "连接"起来......

这些是Event的属性,与elem无关。