加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

flex 冒泡机制

发布时间:2020-12-15 04:02:48 所属栏目:百科 来源:网络整理
导读:事件流机制分为三个阶段:捕获、目标、冒泡。 addEventListener默认关闭了捕获阶段,打开冒泡阶段。并且捕获和冒泡阶段貌似是不能共存的。 一、没有捕获阶段(默认执行)具体是怎么执行的呢? 比如说有abc三个容器。同时对abc三个容器进行单击监听。 a.addEv
事件流机制分为三个阶段:捕获、目标、冒泡。
addEventListener默认关闭了捕获阶段,打开冒泡阶段。并且捕获和冒泡阶段貌似是不能共存的。


一、没有捕获阶段(默认执行)具体是怎么执行的呢?
比如说有abc三个容器。同时对abc三个容器进行单击监听。
a.addEventListener(MouseEvent.CLICK,clickHandle);
b. addEventListener(MouseEvent.CLICK,arial; font-size:14px; line-height:21px">c. addEventListener(MouseEvent.CLICK,arial; font-size:14px; line-height:21px">我单击了c容器。
1、首先执行的是目标阶段。也就是我鼠标单击事件的目标是c容器,执行c容器的clickHandle函数。目标阶段完成。
2、冒泡阶段:将单击的事件冒泡上去,b获得了单击事件,执行clickHandle函数。然后就是c获得单击事件,执行clickHandle函数。

二、打开捕获
打开捕获阶段是怎么样的呢?
我单机了c容器。
1、捕获开始。a捕获到了单击事件执行函数。然后是b捕获到了单击事件执行函数。捕获阶段结束。

2、目标阶段开始。事件流终于流到了目标c,执行c的clickHandle函数。


总结:
1、捕获关闭后,顺序cba,由目标冒泡到父容器,一层一层上去。捕获打开后,顺序abc,由父容器一层一层下去直到目标事件。
2、事件evt:MouseEvent中evt的重要属性有:evt.target(事件目标,指c)、evt.currentTarget(当前事件所处的目标,指冒泡或者捕获阶段当前目标)。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读