有关定义就不多说了,事件分两种
一,冒泡型事件
这是IE浏览器中事件模型的实现,顾名思义,就像水中的泡一样,自底而上,其经过的父元素都会触发对应的事件。
即:触发元素的父元素先于触发元素触发,看demo
二,捕获型事件
这是Netscape 中的实现,它刚好与冒泡型相反,它从元素的顶部向下传递,最终到触发元素。
即:触发元素先于父元素触发,看demo
在上面两个demo中,我们在触发元素和其父元素都绑定的相同的事件,然后触发p元素,可以很清楚的看明白这两种方式的区别。
w3c为了兼容两者,它会先从根节点检查到目标节点,然后再从目标节点冒泡至根节点,因此,捕获型事件,优先于冒泡型事件。
方法介绍:
addEventListener方法
第一个参数是事件类型名,事件类型名是没’on’开头
第二个参数eventListener是回调处理函数
第三个参数true为捕获型,false为冒泡型
attachEvent方法(IE特有的方法,只支持冒泡型事件)
第一个参数是事件类型名,要带"on"开头
第二个参数eventListener是回调处理函数,
注意(利用attachEvent注册的处理函数调用时,this指向不是注册事件的元素,而是window对象。麻烦)
用途:
在冒泡型事件中,我们在一些具有相似操作的元素的父元素上绑定一个方法,然后进行统一处理,
在捕获型事件中,我们可以为一个标签绑定一个统一的过滤方法,做过滤用,具体使用场景,自个去想了。
时间: 2024-10-19 23:59:40