JS事件冒泡和事件捕获

事件流

犹如指向一组同心圆中的一个圆,那么指向的不止是一个圆,是所有的圆。
事件流跟此相似,描述的是从页面中接收事件的顺序,有事件冒泡事件捕获两种。

DOM事件流

包含三个阶段 事件捕获 => 事件处于目标阶段 => 时间冒泡阶段
利用event.stopPropagation()可以取消进一步的事件捕获或者冒泡
利用event.preventDefault()可以阻止事件的默认行为

1.事件冒泡

事件由最具体的元素接收,然后向上传播到较为不具体的节点。
如:从button => document

2.事件捕获

事件由最不具体的更早接收,而最具体的节点最后接收到事件。
如:从document => button

其他:

DOM0事件

类似于onclick事件属于DOM0事件,该事件可以为获取的文档引用指定,被认为是元素的方法,所以程序中的this引用指向当前元素

DOM2级事件处理

有两个事件处理操作:addEventListener()removeEventListener(),所有DOM节点都包含这两个方法。注:事件有三个参数(事件名事件处理程序[事件捕获true/事件冒泡false]
this指向调用addEventListener的元素。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。