吃瓜一览:
js中什么是冒泡事件?
事件冒泡:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发。即子级元素先触发,父级元素后触发。js的优点:在JavaScript这样的用户端脚本语言语言出现之前,传统的数据提交和验证工作均由用户端浏览器通过网络传输到服务器上进行。
以前,Nets[文]cape和Mi[章]crosoft[来]是不同的实现方[自]式。Netsc[吃]ape中,di[瓜]v先触发,这就[网]叫做事件捕获。[文]Microso[章]ft中,p先触[来]发,这就叫做事[自]件冒泡。两种事[吃]件处理顺序刚好[瓜]相反。IE只支[网]持事件冒泡,M[文]ozilla,[章] Opera 7 和 Konquer[来]or两种都支持[自],旧版本的Op[吃]eras 和 iCab两种都[瓜]不支持 。
事件的传播是有[网]方向的,当点击[文]一个按钮时所产[章]生的事件从这个[来]按钮处开始向上[自]传播(就像一个[吃]水泡从杯底冒上[瓜]来,这就是之所[网]以叫事件冒泡的[文]原因),但这个[章]事件总是寻找特[来]定的属性是否有[自]值。
首先纠正你一个[吃]重要的概念:事[瓜]件是被动触发的[网],并不是你能主[文]动“加”上去的[章]。换句话说,元[来]素只要符合某种[自]事件的触发条件[吃](比如鼠标点击[瓜]),事件就必定[网]会触发,而你所[文]谓的“加”上去[章]的是js对事件[来]的处理过程(没[自]有加的话就不会[吃]对事件做任何处[瓜]理,但并不等于[网]说事件就没有触[文]发)。
事件冒泡:js[章]会逆着文档流顺[来]序由内至外,一[自]次触发事件。
事件流:指从页面中接收事件的顺序,有冒泡流和捕获流。当页面中发生某种事件(比如鼠标点击,鼠标滑过等)时,毫无疑问子元素和父元素都会接收到该事件,可具体顺序是怎样的呢?冒泡和捕获则描述了两种不同的顺序。
JS为什么要阻止事件冒泡
有种可能是,某个DOM节点绑定了某事件监听器,本来是想当该DOM节点触发事件,才会执行回调函数。结果是该节点的某后代节点触发某事件,由于事件冒泡,该DOM节点事件也会触发,执行了回调函数,这样就违背了最初的本意了。
因为事件源本身[吃]并没有处理事件[瓜]的能力。例如我[网]们点击一个按钮[文]时,就会产生一[章]个click事[来]件,但这个按钮[自]本身不能处理这[吃]个事件(废话)[瓜],事件必须从这[网]个按钮传播出去[文],从而到达能够[章]处理这个事件的[来]代码中(例如我[自]们给按钮的on[吃]click属性[瓜]赋一个函数的名[网]字,就是让这个[文]函数去处理该按[章]钮的click[来]事件)。
这种情况是因为[自]事件冒泡了,点[吃]击body的d[瓜]iv触发的流程[网]是这样的。首先[文]检测div有没[章]onclick[来]事件,若有则执[自]行。然后再向上[吃]一级找父标签的[瓜]onclick[网]事件执行,一直[文]往上执行直至b[章]ody。如果你[来]所说的任何位置[自]在于body的[吃]其中一个范围,[瓜]那你可以在需要[网]触发范围定义一[文]个div,然后[章]定义一个onc[来]lick事件。[自]里面可以包含一[吃]些标签。
e.targe[瓜]t属性可以获取[网]到当前触发事件[文]的子元素。
false,这[章]样比较安全。通[来]常情况下,我们[自]不会去做阻止事[吃]件冒泡的事情,[瓜]但是有时候当我[网]们不想同时执行[文]绑定在两个 DOM 元素上的事件时[章],我们需要手动[来]的阻止事件的冒[自]泡,通常我们使[吃]用如下几种方式[瓜]来阻止:默认事[网]件:该元素默认[文]执行的动作。
附:事件冒泡(的过程):事件从发生的目标(event.srcElement||event.target)开始,沿着文档逐层向上冒泡,到document为止。
事件委托的原理以及优缺点
1、优点:内存效率、简化代码、缺点:无法直接操作子元素、性能问题。事件冒泡:在事件流中,事件从最内层元素开始触发,向外层传递,即事件冒泡。
2、事件委托缺[章]点:事件委托基[来]于冒泡,对于不[自]冒泡的事件不支[吃]持 层级过多,冒泡[瓜]过程中,可能会[网]被某层阻止掉。[文]理论上委托会导[章]致浏览器频繁调[来]用处理函数,虽[自]然很可能不需要[吃]处理。所以建议[瓜]就近委托,比如[网]在table上[文]代理td,而不[章]是在docum[来]ent上代理t[自]d。把所有事件[吃]都用代理就可能[瓜]会出现事件误判[网]。
3、而事件委托[文]就是利用的DO[章]M事件的事件捕[来]获阶段。把具体[自]dom上发生的[吃]事件,委托给更[瓜]大范围的dom[网]去处理。好比送[文]信员,如果每次[章]都把信件送给每[来]一户,非常繁琐[自]。但是如果交给[吃]一个大范围的管[瓜]理者,比如小区[网]的传达室,那么[文]事情会变得非常[章]简单。
4、事件委托是[来]一种在Java[自]Script中[吃]处理事件的技术[瓜]。它利用了事件[网]的冒泡机制,将[文]事件处理程序绑[章]定到它们的共同[来]祖先元素上,而[自]不是直接绑定到[吃]每个子元素上。[瓜]当事件触发时,[网]事件会从子元素[文]一直冒泡到祖先[章]元素,然后通过[来]判断事件的目标[自]元素来判断是否[吃]需要执行相应的[瓜]操作。这种方式[网]可以减少内存占[文]用,提高Jav[章]aScript[来]性能 。
发表评论