04-Event对象

nobility 发布于 2022-08-01 04-事件 2471 次阅读


Event对象

每个事件在触发后都会产生一个事件对象,也就是事件监听函数的第一个参数,事件对象也可以通过构造函数的方式手动创建

该对象是事件中的顶层对象,所有事件对象都是该对象的子类对象

构造函数

  • 通常使用事件的构造函数是用来做EventTarget.dispatchEvent(event)方法的参数来手动触发事件的
  • 该构造函数接收两个参数,第一个参数是字符串形式的事件名称,第二个参数是一个可省略的配置对象,配置如下:这些配置也是实例对象的部分属性
配置项 说明
bubbles 该事件对象是否冒泡,默认是false
cancelable 该事件是否可以取消默认行为,即能否用Event.preventDefault()取消这个事件

实例属性

属性名 描述
Event.target 触发该事件的目标节点,在没有子节点的情况下就是this,有子节点且有事件委托情况下就是子节点
Event.currentTarget 绑定该事件的节点,也就是this,箭头监听函数无法使用this可以使用该属性代替
Event.cancelBubble 设置该事件是否冒泡,Event.stopPropagation()的别名
Event.eventPhase 该事件所处的阶段;0=未触发,1=冒泡阶段,2=目标阶段,3=捕获阶段
event.defaultPrevented 判断该事件是否取消过了默认行为,即是否成功调用过了Event.preventDefault()方法取消了默认行为
Event.type 查看该事件的名称
Event.timeStamp 事件发生的时刻,从页面加载时算起始时间
Event.isTrusted 判断该事件是否由真实用户产生的

实例方法

方法名 描述
Event.preventDefault() 取消浏览器默认行为
Event.stopPropagation() 阻止事件传播,但是本节点的该事件其他监听函数还会执行
Event.stopImmediatePropagation() 立即阻止事件传播,本节点的该事件其他监听函数不会执行
Event.composedPath() 返回一个数组,元素是依次是事件冒泡的顺序的DOM元素
加油啊!即便没有转生到异世界,也要拿出真本事!!!\(`Δ’)/
最后更新于 2022-08-01