js 冒泡事件与事件监听使用分析

更新时间：2009年09月21日 19:50:32 作者：

js 冒泡事件与事件监听代码分析

冒泡事件
js中“冒泡事件(bubble)”并不是能实际使用的花哨技巧，它是一种对js事件执行顺序的机制，“冒泡算法”在编程里是一个经典问题，冒泡算法里面的“冒泡”应该说是交换更加准确；js里面的“冒泡事件”才是真正意义上的“冒泡”，它从DOM最低层逐层遍历树，然后附加相应事件。以下面代码为例：

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

查看运行效果
事件监听
事件监听准确一点讲可以说是js引擎对用户鼠标、键盘、窗口事件等动作的监视进行的操作，也就是针对用户相应的操作进行附加事件，常用的类似 btnAdd.onclick="alert('51obj.cn')"就是一种简单的附加事件，只不过这种方法不支持附加多个事件以及删除事件。以下代码将实现附加事件后删除事件（IE下）：

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

查看运行结果
IE不能称为标准的DOM浏览器，即使是最新的IE8，相对于标准DOM如Firefox、Opera等，它是个“异类”；在Firefox中才真正有称为事件监听的函数addEventListener，如下例

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

查看运行效果
从上面两个例子看出attachEvent在Firefox中并不支持，IE也不支持addEventListener.因此需要使用兼容性的方法。

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

PHP实现本地图片上传和验证功能
这篇文章主要为大家详细介绍了PHP实现本地图片上传和验证功能的相关资料，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2017-02-02
用javascript编写的第一人称射击游戏
用javascript编写的第一人称射击游戏...
2007-02-02
mongoose之bulkWrite操作使用实例
这篇文章主要为大家介绍了mongoose之bulkWrite操作使用实例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2022-09-09
js实现楼层滚动效果
这篇文章主要为大家详细介绍了js实现楼层滚动效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2021-09-09
JS字符串和数组如何实现相互转化
这篇文章主要介绍了JS字符串和数组如何实现相互转化,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
2020-07-07
微信小程序可搜索的地址选择实现详解
这篇文章主要介绍了微信小程序可搜索的地址选择实现详解,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
2019-08-08
用JavaScript做简易的购物车的代码示例
这篇文章主要介绍了用JavaScript做简易的购物车的代码示例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-10-10
js window.print实现打印特定控件或内容
window.print可以打印网页，但有时候我们只希望打印特定控件或内容，怎么办呢？可以把要打印的内容放在div中，然后用下面的代码进行打印，希望对大家有所帮助
2013-09-09
页面图片浮动左右滑动效果的简单实现案例
本篇文章主要是对页面图片浮动左右滑动效果的简单实现案例进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助
2014-02-02
B/S(Web)实时通讯解决方案分享
这篇文章主要为大家分享了B/S(Web)实时通讯的解决方案，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2017-04-04