从 javascript 事件代理，说说事件流和 event（事件）对象

2016-06-23 10:28:00

事件代理

有如下 html 片段

    1. 11111111111    1. 22222222222    1. 33333333333

要对 li 添加 click 事件。通常做法：

var list = document.getElementsByTagName('li');for (var i = 0; i 1. 捕获阶段：这个就是向下去找触发事件的元素。但是一定注意如果这个时候 body 上的 click 并不会触发。如果希望 body 上的 click 先触发，就需要给 addEventListener 第三个参数 useCapture 设置为 true （dom3 引入的，所以比较新的浏览器才有效）。1. 目标阶段：执行目标的绑定函数1. 冒泡阶段：沿着父级元素一路向上，body 上如果也有 click 事件就会执行。event.stopPropagation() 可以用于事件处理函数中阻止冒泡行为。如果希望拿到注册的 dom 元素，可以通过 event.currentTarget 来访问。既然说到这里了，那我们来详细说一下 event 吧。### event 事件对象详解#### 常用属性：1. currentTarget  注册事件的 dom 元素1. srcElement ie6-8 的触发事件的 dom 元素，非标准1. target 触发事件的 dom 元素1. timeStamp 返回事件发生时的时间戳1. type 事件的类型#### 常用方法1. preventDefault() 阻止默认行为。例如 a 标签默认会跳转 href 指定的链接，执行该方法可以阻止跳转的发生。1. stopImmediatePropagation() 阻止冒泡行为，并立即阻止该绑定元素上的相同类型事件处理函数的执行。立即阻止的意义在于，本方法执行之前函数执行或者其他的相同类型绑定不会有问题，但一旦执行该方法后面的程序将不再执行。例子1. stopPropagation() 阻止冒泡行为。#JavaScript、target、事件、function#

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符，请点击举报进行投诉反馈！