javascript 事件冒泡与取消冒泡】的更多相关文章

(一)事件处理模型---事件冒泡.捕获 (1)事件冒泡 24 <body> 25 <div class="warpper"> 26 <div class="content"> 27 <div class="box"> 28 29 </div> 30 </div> 31 </div> 32 <script type="text/javascript&…
事件冒泡: 当一个元素上的事件被触发时,比如说鼠标点击了一个按钮,同样的事件将会在那个元素的所有祖先中被触发,这一过程被称为事件冒泡. 这个事件从原始祖先开始,一直冒泡到DOM树的最上层.(bug) (本来应该一人做事一人当,结果我做错了事,你却去告诉了我妈) 简单来说,冒泡就是:子元素事件被触动,父盒子的同样事件也会被触动. 取消冒泡就是取消这种机制. 阻止冒泡: 火狐.谷歌.IE11:event.stopPropagation(); IE10以下:event.cancelBubble = t…
JavaScript事件对象 学习要点: 1.事件对象 2.鼠标事件 3.键盘事件 4.W3C与IE JavaScript事件的一个重要方面是它们拥有一些相对一致的特点,可以给你的开发提供更多的强大功能.最方便和强大的就是事件对象,他们可以帮你处理鼠标事件和键盘敲击方面的情况,此外还可以修改一般事件的捕获/冒泡流的函数. 一.事件对象 事件处理函数的一个标准特性是,以某些方式访问的事件对象包含有关于当前事件的上下文信息. 事件处理三部分组成:对象.事件处理函数=函数.例如:单击文档任意处. //…
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>自定义对象</title> <!-- 自定义对象是一种特殊数据类型,由属性和方法封装而成. --> <script type="text/javascript"> function method1() { var person=new Object();…
本资源引自: 解析Javascript事件冒泡机制 - 我的程序人生 - 博客频道 - CSDN.NET http://blog.csdn.net/luanlouis/article/details/23927347 ----------------------------------------------------------------------------------------------------------------------------------------- 1.…
本节要点:1.干预系统的事件处理机制 (一)DOM事件流 (二)停止事件冒泡 (三)阻止事件的默认行为 1.干预系统的事件处理机制 (一)DOM事件流 DOM模型是一个树形结构,在DOM模型中,HTML元素是有层次的.当一个HTML元素上产生一个事件时,该事件会在DOM树中元素节点与根节点之间按特定的顺序传播,路径所经过的节点都会收到该事件,这个传播过程就是DOM事件流. DOM事件标准定义了两种事件流,分别是捕获事件和冒泡事件. 1.冒泡事件流 默认情况下,事件使用冒泡事件流.当事件(例如单击…
1. 事件 在浏览器客户端应用平台,基本生都是以事件驱动的,即某个事件发生,然后做出相应的动作. 浏览器的事件表示的是某些事情发生的信号.事件的阐述不是本文的重点,尚未了解的朋友,可以访问W3school教程 进行了解,这将有助于更好地理解以下的内容 . 2.冒泡机制 什么是冒泡呢? 下面这个图片大家应该心领神会吧,气泡从水底开始往上升,由深到浅,升到最上面.在上升的过程中,气泡会经过不同深度层次的水. 相对应地:这个气泡就相当于我们这里的事件,而水则相当于我们的整个dom树:事件从dom 树的…
对“捕获”和“冒泡”这两个概念,我想我们对冒泡更熟悉一些,因为在我们使用的所有浏览器中,都支持事件冒泡,即事件由子元素向祖先元素传播的,就 像气泡从水底向水面上浮一样.而在像firefox,chrome,safari这类所谓的标准浏览器中,事件传播还有个阶段,那就是捕获阶段,这个很少 有用武之地,所以被人疏忽遗忘也在所难免了,不常用不代表它不存在,本着科学严谨的态度,我们有必要去看一下它的庐山真面目. 事实上,捕获阶段是一个和冒泡阶段完全相反的过程,即事件由祖先元素向子元素传播,和一个石子儿从水…
1. 事件 在浏览器客户端应用平台,基本生都是以事件驱动的,即某个事件发生,然后做出相应的动作. 浏览器的事件表示的是某些事情发生的信号.事件的阐述不是本文的重点,尚未了解的朋友,可以访问W3school教程 进行了解,这将有助于更好地理解以下的内容 . 2.冒泡机制 什么是冒泡呢? 下面这个图片大家应该心领神会吧,气泡从水底开始往上升,由深到浅,升到最上面.在上升的过程中,气泡会经过不同深度层次的水. 相对应地:这个气泡就相当于我们这里的事件,而水则相当于我们的整个dom树:事件从dom 树的…
本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 绑定事件的两种方式 我们在上一篇文章中已经讲过事件的概念.这里讲一下注册事件的两种方式,我们以onclick事件为例. 方式一:onclick 举例: <body> <button>点我</button> <script> var btn = document.getElementsByTagName("button&qu…