浅谈JavaScript的事件（事件流）
事件流描述的是从页面中接收事件的顺序。IE的事件流失事件冒泡，而Netspace的事件流失事件捕获。
- 事件冒泡
IE的事件流叫事件冒泡，即事件开始时，由具体的元素（文档中嵌套层次最深的节点）接收，然后向上传播到不具体的节点。
<html onclick="console.log('html')">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body onclick="console.log('body')">
<div id="aa" onclick="console.log('div');" style="width: 100px;">2222</div>
</body>
</html>
上面的代码中，如果单击了div，则事件会按照div、body、html的顺序执行。也就是说事件首先发生了div上，而div也就是我们单击的元素。然后事件按照dom向上传播，直至传播到document对象。所有浏览器都支持事件冒泡。
function stopBubble(e){
if(e&&e.stopPropagation){
e.stopPropagation();
}
else{
window.event.cancelBubble=true;
}
}
通过上面的stopBubble函数能够阻止事件的冒泡。上面的写法兼容了ie和非ie浏览器。
- 事件捕获
事件捕获的思想是不太具体的节点先接收到事件，最具体的节点最后接收到事件。事件捕获的用意在于事件到达最终的节点前，就可以捕获。如果以前面的例子，则事件发生的顺序为document、html、body和div。
- DOM事件流
事件流包含三个阶段：事件捕获阶段、处于目标阶段和事件冒泡阶段。首先发生的是事件捕获，为事件的截获提供了机会。然后是实际目标接收到事件。最后一个是事件冒泡阶段，可以在这这个阶段对事件作出响应。
在dom事件流中，具体元素div在捕获阶段不会获取到事件，这意味着事件从document到html，到body就停止了。下一个阶段处于目标阶段，于是事件在div上面发生，并在事件处理中被看成事件冒泡阶段的一部分。最后事件冒泡发生，并将事件回传到document。ie8以及更早的浏览器不支持Dom事件流。
浅谈JavaScript的事件（事件流）的更多相关文章
- 浅谈JavaScript中的事件
引言 Html页面与JavaScript之间的交互是通过事件来完成的.事件,就是文档或者浏览器窗口中发生的一些特定的交互瞬间.可以使用侦听器(处理程序)来预订事件,以便事件发生时执行相应的代码.这在传 ...
- 浅谈Javascript单线程和事件循环
单线程 Javascript 是单线程的,意味着不会有其他线程来竞争.为什么是单线程呢? 假设 Javascript 是多线程的,有两个线程,分别对同一个元素进行操作: function change ...
- 浅谈javascript的Touch事件
js的touch事件,一般用于移动端的触屏滑动 代码如下: $(function(){ document.addEventListener("touchmove", _touch, ...
- 浅谈javascript函数节流
浅谈javascript函数节流 什么是函数节流? 函数节流简单的来说就是不想让该函数在很短的时间内连续被调用,比如我们最常见的是窗口缩放的时候,经常会执行一些其他的操作函数,比如发一个ajax请求等 ...
- 浅谈JavaScript中的闭包
浅谈JavaScript中的闭包 在JavaScript中,闭包是指这样一个函数:它有权访问另一个函数作用域中的变量. 创建一个闭包的常用的方式:在一个函数内部创建另一个函数. 比如: functio ...
- 浅谈JavaScript浮点数及其运算
原文:浅谈JavaScript浮点数及其运算 JavaScript 只有一种数字类型 Number,而且在Javascript中所有的数字都是以IEEE-754标准格式表示的.浮点数的精度问题 ...
- 浅谈 JavaScript 编程语言的编码规范
对于熟悉 C/C++ 或 Java 语言的工程师来说,JavaScript 显得灵活,简单易懂,对代码的格式的要求也相对松散.很容易学习,并运用到自己的代码中.也正因为这样,JavaScript 的编 ...
- 浅谈javascript的原型及原型链
浅谈javascript的原型及原型链 这里,我们列出原型的几个概念,如下: prototype属性 [[prototype]] __proto__ prototype属性 只要创建了一个函数,就会为 ...
- 浅谈JavaScript中的null和undefined
浅谈JavaScript中的null和undefined null null是JavaScript中的关键字,表示一个特殊值,常用来描述"空值". 对null进行typeof类型运 ...
- 浅谈JavaScript中的正则表达式（适用初学者观看）
浅谈JavaScript中的正则表达式 1.什么是正则表达式(RegExp)? 官方定义: 正则表达式是一种特殊的字符串模式,用于匹配一组字符串,就好比用模具做产品,而正则就是这个模具,定义一种规则去 ...
随机推荐
- POJ 2092 Grandpa is Famous
Grandpa is Famous Time Limit: 2000MS Memory Limit: 30000K Total Submissions: 7153 Accepted: 3624 ...
- Ubuntu Flask安装与配置（待整理）
工作中开发需要用到python的flask框架,无奈网络上的资源很少,连基本的安装和配置都不全,在这做一下整理,方便以后用到. ———————————————————————————— 由于比较繁琐, ...
- hdu6069[素数筛法] 2017多校4
对于[l , r]内的每个数,根据唯一分解定理有 所以有 因为 //可根据唯一分解定理推导 所以 题目要求 就可以运用它到上述公式 (注意不能暴力对l,r内的数一个个分解算贡献 ...
- mac安装R语言启动后-Warning messages
During startup - Warning messages: : Setting LC_CTYPE failed, using "C" : Setting LC_COLLA ...
- bzoj3196 二逼平衡树 树套树（线段树套Treap）
Tyvj 1730 二逼平衡树 Time Limit: 10 Sec Memory Limit: 128 MBSubmit: 4697 Solved: 1798[Submit][Status][D ...
- json格式前端显示
使用angular可以稍加修改. [转]http://web.jobbole.com/82865/ function output(inp) { document.body.appendChild(d ...
- Linux（10）：期中架构（2）--- NFS存储服务 & 实时同步
1. 共享存储服务概念: # NFS是Network File System的缩写,中文意思是网络文件系统, # 它的主要功能是通过网络(一般是局域网)让不同的主机系统之间可以共享文件或目录. 2. ...
- centos7如何查看ip信息(centos 6.5以前都可以用ifconfig 但是centos 7里面没有了，centos 7用什么查看？)
展开全部 centos7如何查看ip信息可以这样解决: 1.首先要先查看一下虚拟机的ip地址,因为ipconfig不是centos7,因此要使用 ip addr来查看. 2.查看之后你就会发现ens3 ...
- 在dedecms系统下， 改写火车头的入库接口 写一个接口文件运行一次自动读取 http://news.163.com/rank/
1:火车头入库接口里面的密码与login.php传过来的密码是保持一致的: 2:在(!$ispost)里面编写一个form表单提交,验证用户名,channelid,以及typeid; html代码格式 ...
- golang log日志
写入日志文件 func main() { file, err := os.Create("test.log") if err != nil { log.Fatalln(" ...