Dom Api Event

Event 接口表示在 DOM 中出现的事件

事件可以有用户触发,例如鼠标或键盘事件;或者由 API 生成以表示异步任务的进度。事件也可以通过编程方式触发,例如对元素调用 HTMLElement.click() 方法

有很多事件类型是继承 Event, 例如:ClipboardEventErrorEventFetchEvent 等,具体使用方法请自行查阅。

如何进行事件监听
通过 EventTarget.addEventListener() 方法可以将事件处理器绑定到不同的 HTML 元素上(比如 、

、 等等

如何移除事件监听
使用 removeEventListener() 方法移除这些事件处理器。

下面我们根据功能点介绍属性和方法,减少一下大家的心里负担。删除属性或未来将要删除的属性不再介绍

** 如何触发自定义事件**
EventTarget.dispatchEvent() 方法将自定义事件派发往指定的目标

事件冒泡
Event.bubbles 用来表示该事件是否会在 DOM 中冒泡
event.stopPropagation 停止冒泡,阻止事件在 DOM 中继续冒泡

事件默认行为
Event.defaultPrevented 一个布尔值,表示 event.preventDefault() 方法是否取消了事件的默认行为
event.preventDefault 取消事件(如果该事件可取消)

事件取消
Event.cancelable 一个布尔值,表示事件是否可以取消
event.preventDefault 取消事件(如果该事件可取消)。

Shadow DOM
Event.composed 一个布尔值,表示事件是否可以穿过 Shadow DOM 和常规 DOM 之间的边界进行冒泡。
Event.composedPath() 返回事件的路径(将在该对象上调用监听器)。如果阴影根(shadow root)节点创建时 ShadowRoot.mode 值为 closed,那么路径不会包括该根节点下影子树(shadow tree)的节点

如何获取事件是由用户触发还是脚本触发
Event.isTrusted 表示事件是由浏览器(例如用户点击)发起的,还是由脚本发起的(例如使用事件创建方法)。

事件类型
Event.type 事件的类型,不区分大小写
** 事件阶段 **
Event.eventPhase 指示正在处理的事件流阶段。它是以下数字之一:NONE、CAPTURING_PHASE、AT_TARGET、BUBBLING_PHASE。

** 事件源对象 **
Event.currentTarget 对事件当前注册的目标的引用。这是一个当前计划将事件发送到的对象。它是有可能在重定向(retarget)的过程中被改变的。
Event.target 对最初分发事件的对象的引用。
Event.originalTarget 重定向目标前的事件原始目标。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值