9、前端开发中的事件与 DOM 操作全解析

前端开发中的事件与 DOM 操作全解析

1. 事件处理的关键事件介绍

在实际的 Web 应用开发中，事件处理是至关重要的一部分。以下是一些常见且实用的事件：
| 事件名称 | 适用元素 | 触发条件 | 说明 |
| — | — | — | — |
| load | window | 文档的全部内容（包括所有外部资源）加载完成时触发 | 但该事件触发较晚，绑定 DOM 元素监听器时，可使用自定义的 dom:loaded 事件 |
| submit | <form> | 用户或脚本尝试提交表单时触发 | 事件源元素为表单本身，可取消默认提交行为 |
| click | 大多数元素 | 鼠标在注册事件的元素上按下并释放时触发 | 不限于左键，右键和中键点击也可触发 |
| mousedown 和 mouseup | 大多数元素 | 鼠标按钮按下和释放时分别触发 | 一次点击会依次触发 mousedown 、 mouseup 和 click 事件 |
| mouseover、mousemove 和 mouseout | 大多数元素 | 鼠标光标进入、悬停和离开元素表面时分别触发 | 多数“悬停”效果可通过 CSS 更高效实现 |
| keydown 和 keyup | 大多数元素（通过冒泡） | 按键按下和释放时分别触发 | 可使用事件对象的 keyCode 属性 |
| change | <input>