常用事件类型

最后更新：2026-09-09

常用事件类型常用事件类型

DOM 事件类型一览：鼠标事件、键盘事件、表单事件、触摸事件等。

分类	DOM 操作
ES 版本	DOM

元素.addEventListener('事件类型', 回调);

返回值：undefined。

是否修改原值：否（返回新值）

编辑下方代码，点击运行，在输出面板查看结果：

运行结果：

（各事件触发）

💡 提示 input 事件比 keyup 更适合实时监听输入——支持粘贴和语音输入。

ℹ️ info DOMContentLoaded 在 HTML 解析完成后触发——比 window.load 更早。

浏览器	Chrome	Edge	Firefox	Safari	Opera
常用事件类型	✓ v1	✓ v12	✓ v1	✓ v1	✓ v1
所有现代浏览器均支持

更多实战案例即将上线，敬请期待。

Qinput 和 change 事件的区别？

Ainput 实时触发（每键一次）；change 失焦时触发。

QDOMContentLoaded 和 load 的区别？

ADOMContentLoaded 在 HTML 解析完触发；load 等所有资源（图片/CSS）加载完。

Q如何阻止表单提交跳转？

Aform.addEventListener('submit', e => e.preventDefault())。

Web-Tutorial 技术团队

由多位开发者共同维护的编程教程平台。每篇教程由对应领域的开发者编写和审核，确保内容准确可靠。如发现任何问题，欢迎向我们反馈。