javaScript 事件模型

本文深入解析了DOM事件的不同级别,从DOM0级的直接绑定到DOM3级的多种事件类型,包括UI事件、焦点事件、鼠标事件等,以及如何通过addEventListener和removeEventListener进行事件的绑定和解绑。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

DOM0

直接绑定

<input onclick="sayHi()"/>

btn.onclick = function() {}
btn.onclick = null

DOM2

DOM2 级事件可以冒泡和捕获 通过 addEventListener 绑定 通过 removeEventListener 解绑
// 绑定

btn.addEventListener('click', sayHi)
// 解绑
btn.removeEventListener('click', sayHi)

DOM3

DOM3 具有更多事件类型 DOM3 级事件在 DOM2 级事件的基础上添加了更多的事件类型,全部类型如下:
1 UI事件,当用户与页面上的元素交互时触发,如:load、scroll
2 焦点事件,当元素获得或失去焦点时触发,如:blur、focus
3 鼠标事件,当用户通过鼠标在页面执行操作时触发如:dbclick、mouseup
4 滚轮事件,当使用鼠标滚轮或类似设备时触发,如:mousewheel
5 文本事件,当在文档中输入文本时触发,如:textInput
6 键盘事件,当用户通过键盘在页面上执行操作时触发,如:keydown、keypress
7 合成事件,当为IME(输入法编辑器)输入字符时触发,如:compositionstart
8 变动事件,当底层DOM结构发生变化时触发,如:DOMsubtreeModified

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值