本文介绍了DOM元素如何响应各种事件，如键盘、鼠标、窗口和表单事件，并通过示例展示了如何在JavaScript中监听并处理这些事件。当用户点击按钮时，事件对象的`type`属性将显示事件类型，`target`属性则标识了事件发生在哪个DOM元素上。通过事件对象，开发者可以获取详细信息并执行相应操作。
DOM 元素可以触发多种类型的事件。以下是主要事件类别。
| 类别 | 例子 |
|---|---|
| 键盘事件 | 按下或释放一个键 |
| 鼠标事件 | 按下或释放一个键 |
| 窗口事件 | 加载或关闭网页、调整大小、滚动 |
| 表单事件 | 更改表单字段的焦点，提交表单 |
每个事件都和一个事件对象相关联，该对象具有属性（关于时间的信息）和方法（对事件进行操作的方法）。此对象可由处理函数使用。
与事件关联的对象的许多属性取决于事件 type。有些属性总是存在的，比如事件返回类型 type 和 返回事件目标 target（DOM 元素是事件源）。
下面的代码使用此对象在控制台中显示事件类型和目标。
<html>
<head>
</head>
<body>
<button id="myButton">Click me!</button>
</body>
</html>当用户点击按钮时，返回事件的类型和目标
// Show event type and target when the user clicks on the button
document.getElementById("myButton").addEventListener("click", e => {
console.log(`Event type: ${e.type}, target: ${e.target}`);
});输出结果：
388
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
