浅谈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)? 官方定义: 正则表达式是一种特殊的字符串模式,用于匹配一组字符串,就好比用模具做产品,而正则就是这个模具,定义一种规则去 ...
随机推荐
- NYOJ 104 最大和
最大和 时间限制:1000 ms | 内存限制:65535 KB 难度:5 描述 给定一个由整数组成二维矩阵(r*c),现在需要找出它的一个子矩阵,使得这个子矩阵内的所有元素之和最大,并把这个 ...
- Non-maximum suppression(非极大值抑制算法）
在RCNN系列目标检测中,有一个重要的算法,用于消除一些冗余的bounding box,这就是non-maximum suppression算法. 这里有一篇博客写的挺好的: http://www.c ...
- Mahout0.9安装与配置（完全分布式模式下运行）
安装Mahout之前,一定要把hadoop装好,hadoop的安装方法可以参考我的前一篇随笔,我安装的是hadoop2.7.0,具体方法在此不做介绍. 1.首先下载相应版本的Mahout: axel ...
- 将RabbitMq用好需要了解的一些基础知识
本文面向有一定RabbitMq基础的童鞋. 首先,我们来理理RabbitMq的一些基本概念: Connection: 客户端与RabbitMq服务器节点的Tcp链接. Channel: 信道,因为一条 ...
- mysql报错Packet for query is too large (12238 > 1024). You can change this value
今天将项目部署到linux服务器的时候莫名其妙的报一些错误,可是在本地啥错没有,通过实时查看tomcat 的日志之后发现报错是: 实时查看日志: .先切换到:cd usr/local/tomcat5/ ...
- MongoDB_起步
MongoDB基本概念 <1> mogoDB是一个文档存储类型的nosql数据库,文档存储一般用类似json的格式存储,存储的内容是文档型的. 这样也就有机会对某些字段建立索引, < ...
- Cookie 和 Session 有什么区别呢？
Cookie 和 Session 有什么区别呢?大部分的面试者应该都可以说上一两句,比如:什么是 Cookie?什么是 Session?两者的区别等 但如果再往深入探讨的话,就慢慢有一些朋友不太了解了 ...
- windows下安装python、环境设置、多python版本的切换、pyserial与多版本python安装、windows命令行下切换目录
1.windows下安装python 官网下载安装即可 2.安装后的环境设置 我的电脑--属性--高级--设置path的地方添加python安装目录,如C:\Python27;C:\Python33 ...
- Codeforces 123 E Maze
Discription A maze is represented by a tree (an undirected graph, where exactly one way exists betwe ...
- How to Upgrade PIP in Windows
https://datatofish.com/upgrade-pip/ 这个网站写的非常的全