DOM事件机制解惑(摘)--事件的传播机制
2024-09-25 22:31:58
DOM事件流
为什么是有事件流?
假如在一个button上注册了一个click事件,又在其它父元素div上注册了一个click事件,那么当我们点击button,是先触发父元素上的事件,还是button上的事件呢,这就需要一种约定去规范事件的执行顺序,就是事件执行的流程。
浏览器在发展的过程中出现实了两种不同的规范
- IE9以下的IE浏览器使用的是事件冒泡,先从具体的接收元素,然后逐步向上传播到不具体的元素。
- Netscapte采用的是事件捕获,先由不具体的元素接收事件,最具体的节点最后才接收到事件。
- 而W3C制定的Web标准中,是同时采用了两种方案,事件捕获和事件冒泡都可以。
事件阶段
既然有了事件捕获和事件冒泡,那就应该约定是事件的流向,是先捕获还是先冒泡,所以W3C标准中规定了事件流的三个阶段的顺序:
- 事件捕获阶段
- 处于目标阶段
- 事件冒泡阶段
有了捕获和冒泡这两种模式,我们就可以很好的控制父元素和子元素的事件执行顺序了
所以这里需要一种方法,不让事件向下捕获或向上冒泡
所以有了 e.stopPropagation()
方法,用于阻止事件的继续传递。
执行这条语句,无论我们是使用捕获模式还是冒泡模式,事件都不会继续传递,只会响应我们点击的元素。
http://coderlt.coding.me/2016/11/22/js-event/
最新文章
- Git Stash紧急处理问题,需要切分支
- Asp.net MVC 路由基础
- SQL1159 Initialization error with DB2 .NET Data Provider, reason code 7(问题补充)
- sharepoint2010无法创建网站集
- ASP.Net:Table类的使用
- 如何让Vim显示dos下的^M符号
- LeetCode 338
- SSL交互和握手过程
- 去掉Eclipse打开后定期弹出Usage Data Upload对话框
- lightoj 1104 Birthday Paradox
- Spring MVC的实现原理
- [Manacher]【学习笔记】
- JVM垃圾收集器&;对象的引用回收
- 阿里云服务器连接邮箱SMTP服务器time out的解决
- 2017 ACM Jordanian Collegiate Programming Contest
- P1577 切绳子(二分)
- github下载更新代码到本地
- poj3481 splaytree模板题
- Python进阶【第一篇】:Python简介
- (转载)Java 自动装箱与拆箱、equals和==的比较