DOM事件流
事件发生时会在元素节点之间按照特定的顺序传播,这个传播过程即DOM事件流
注意:
1.JS 代码中 只能执行捕获或者冒泡其中的一个阶段
2.onclick 和 attachEvent 只能得到冒泡阶段
3.addEventListener(type,listener[,useCapture]) 第三个参数是 true ,那么处于捕获阶段, 执行顺序:document -> html -> body -> father-> son
案例:先弹出 father 再弹出 son
son.addEventListener('click',function(){
alert('son');
},true);
father.addEventListener('click',function(){
alert('father');
},true);
4.冒泡阶段 如果addEventListener 第三个参数是 false 或者 省略,那么处于冒泡阶段
执行顺序:son -> father -> body -> html -> document
案例:先弹出 son 再 弹出 father
son.addEventListener('click',function(){
alert('son');
},false);
father.addEventListener('click',function(){
alert('father');
},false);
5.实际开发中我们很少使用事件捕获,我们更关注 事件冒泡
6.有些事件是没有冒泡的,比如 onblur 、onfocus、onmouseenter、onmouseleave
7.事件冒泡有时候会带来麻烦,有时候又会帮助很巧妙的做某些事件。
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步