Javascript中事件,事件流以及阻止事件冒泡的详解

本文详细介绍了JavaScript中的事件、事件流和事件冒泡概念,包括DOM事件流的捕获阶段、目标阶段和冒泡阶段。探讨了不同浏览器对事件处理的差异,如addEventListener和detachEvent。此外,还讨论了事件代理的原理和优势,以及如何通过stopPropagation和preventDefault来阻止事件冒泡和默认行为。
摘要由CSDN通过智能技术生成

1.什么事件?什么是事件流 ?事件流的出现?

一.什么是事件?
事件是文档或者浏览器窗口中发生的,特定的交互瞬间。

  事件是用户或浏览器自身执行的某种动作,如click,load和mouseover都是事件的名字。
  事件是javaScript和DOM之间交互的桥梁。你若触发,我便执行——事件发生,调用它的处理函数执行相应的   JavaScript代码给出响应。典型的例子有:页面加载完毕触发load事件;用户单击元素,触发click事件

事件流:
通过使用JavaScript,你可以监听特定事件的发生,并规定让某些事件发生以对这些事件做出响应
事件发生时会在元素节点与根节点之间按照特定的顺序传播,路径所经过的所有节点都会收到该事件,这个传播过程即DOM事件流。
事件流就是描述了页面中接受事件的顺序,在浏览器发展的初期,两大浏览器厂商IE和Netscape互掐,出现了一个坑爹的情况,那就是他们对事件流的解释出现了两中截然相反的定义。也就是我们所熟悉的:IE的事件冒泡,Netscape的事件捕获。对于IE浏览器和chrome,火狐,微软浏览器来说,兼容性性要处理,尤其是对IE来说,对其兼容性有一些特别的处理。事件流描述的是从页面中接收事件的顺序。
DOM(文档对象模型)结构是一个树型结构,当一个HTML元素产生一个事件时,该事件会在元素结点与根结点之间的路径传播,路径所经过的结点都会收到该事件,这个传播过程可称为DOM事件流。
二.事件的传播

关于事件的传播网景公司和微软公司有不同的理解,

微软公司认为事件应该是由内向外传播,也就是当事件触发时,应该先触发当前元素上的事件,然后再向当前元素的祖先元素上传播,也就说事件应该在冒泡阶段执行。

网景公司认为事件应该是由外向内传播的,也就是当前事件触发时,应该先触发当前元素的最外层的祖先元素的事件,然后在向内传播给后代元素

三.事件传播的阶段(DOM2级事件)
1.捕获型阶段:
事件捕获即事件最早由不太具体的节点接收,而最具体的节点最后接收到事件。点击text部分时,先由window接收,然后逐级传播至text元素;即由最不特定的事件目标到最特定的事件目标,DOM的根到叶子。
2.目标阶段
当事件到达目标节点时,事件就进入了目标阶段。事件在目标节点上被触发,然后逆向回流,知

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值