事件冒泡 模型

addEventListener 是在DOM2 标准中定义的方法，所以只用支持DOM2的浏览器才支持这方法（IE9）

IE8 及其之前的用 attachEvent  ，这个只支持事件冒泡，因此事件处理程序也只在冒泡阶段调用

事件流

意味着页面上不只一个元素可以相应同一个事件，当你单击一个按钮时，它的容器，整个页面如同一个整体

事件捕获比事件冒泡先出现，目标事件事实上两次接收事件 5 和 6

不要忘记点击的文字节点，不然会头疼  （IE 不太一样， 没有text）

标准的DOM事件流，触发目标元素事件应该是只有一次的，在冒泡阶段，但浏览器实现的时候接收到两次

时间： 2024-10-17 23:04:43

事件冒泡 模型的相关文章

聊聊事件冒泡与事件捕获

什么是事件? 事件是文档和浏览器窗口中发生的特定的交互瞬间. 什么是事件流: 事件流描述的是从页面中接受事件的顺序( 说白了就是解决页面中事件流发生顺序的问题.),但有意思的是,微软(IE)和网景(Netscape)开发团队居然提出了两个截然相反的事件流概念,IE的事件流是事件冒泡流(event bubbling),而Netscape的事件流是事件捕获流(event capturing). 让我们先聊聊DOM0级事件与DOM2级事件 DOM0 直接通过 onclick写在html里面的事件, 比

javascript 事件传播与事件冒泡，W3C事件模型

说实话笔者在才工作的时候就听说了什么"事件冒泡",弄了很久才弄个大概,当时理解意思是子级dom元素和父级dom元素都绑定了相同类型的事件,这时如果子级事件触发了父级也会触发,然后这就叫做"事件冒泡".然而,事情要是这么简单的话,相信笔者这时一定已经迎娶了白富美,当上了CEO.坏就坏在后来又听说一个"事件传播" ,尼玛不是"事件冒泡"吗,然后又听说了"W3C事件模型"...到了最后笔者彻底心碎了,只能乖乖的当

事件处理模型——事件冒泡、捕获

事件冒泡(不绑定事件处理函数一样会发生冒泡事件) 结构上(非视觉上)嵌套关系的元素,会存在事件冒泡的功能,即同一个事件,自子元素冒泡向父元素(自底向上) <div class="first" style="width: 300px; height: 300px; background-color: red;"> <div class="secend" style="width: 200px; height: 200px

js之事件冒泡和事件捕获详细介绍

(1)冒泡型事件:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发. IE 5.5: div -> body -> document IE 6.0: div -> body -> html -> document Mozilla 1.0: div -> body -> html -> document -> window (2)捕获型事件(event capturing):事件从最不精确的对象(document 对象)开

js 事件冒泡和事件捕获

(1)冒泡型事件:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发. IE 5.5: div -> body -> document IE 6.0: div -> body -> html -> document Mozilla 1.0: div -> body -> html -> document -> window (2)捕获型事件(event capturing):事件从最不精确的对象(document 对象)开

事件冒泡与捕获

事件流指的是页面中接收事件的顺序,IE,火狐和chrome浏览器都是事件冒泡,所谓是事件冒泡指的是事件最开始由最具体的元素接收,然后逐级向上传播到不具体的节点.而事件捕获则正好相反,事件捕获是由Netscape提出的,事件冒泡和捕获具体如下图所示: 虽然事件捕获是Netscape唯一支持的事件流模型,但目前IE9,火狐和谷歌也都支持这种事件流模型. 事件冒泡的好处 因为事件具有冒泡机制,因此我们可以利用冒泡的原理,把事件加到父级上,触发执行效果.这样做的好处当然就是提高性能了. 如果说我们可能有

看懂此文，不再困惑于javascript中的事件绑定、事件冒泡、事件捕获和事件执行顺序

最近一个项目基于3维skyline平台,进行javascript二次开发.对skyline事件的设计真是无语至极,不堪折磨啊!抽空学习了下javascript和jquery的事件设计,收获颇大,总结此贴,和大家分享. (一)事件绑定的几种方式 javascript给DOM绑定事件处理函数总的来说有2种方式:在html文档中绑定.在js代码中绑定.下面的方式1.方式2属于在html中绑定事件,方式3.方式4和方式5属于在js代码中绑定事件,其中方法5是最推荐的做法. 方式1: HTML的DOM元素

JavaScript——事件流（事件冒泡和事件捕获）

1.事件流 当浏览器发展到第4代时,浏览器开发团队遇到了一个问题:页面中的哪个元素会拥有某个特定的事件?当你单击某个按钮时,显然该单击事件并不仅仅发生在按钮上,它还发生在按钮的所有祖先元素上,比如按钮的容器元素,容器元素的父元素,甚至整个页面document.但是,哪个元素最先接收到该事件呢?页面接收事件的顺序又是怎样的呢?由此引出了事件流的概念.事件流描述的就是从页面中接收事件的顺序. 2.两个模型 Netscape和Microsoft给出了两个不同的结论.Netscape说document会

javascript中的事件冒泡、事件捕获和事件执行顺序

谈起JavaScript的 事件,事件冒泡.事件捕获.阻止默认事件这三个话题,无论是面试还是在平时的工作中,都很难避免. DOM事件标准定义了两种事件流,这两种事件流有着显著的不同并且可能对你的应用有着相当大的影响.这两种事件流分别是捕获和冒泡.和许多Web技术一样,在它们成为标准之前,Netscape和微软各自不同地实现了它们.Netscape选择实现了捕获事件流,微软则实现了冒泡事件流.幸运的是,W3C决定组合使用这两种方法,并且大多数新浏览器都遵循这两种事件流方式. 1事件传播--冒泡与捕