DOM事件监听

在 DOM 中，事件监听是一种常见的技术，用于捕获特定事件（比如点击、鼠标移动等）并在事件发生时执行相应的操作。以下是在 JavaScript 中添加事件监听器的基本步骤：

1. 选取要添加事件监听的元素：可以通过 document.getElementById(), document.getElementsByClassName(), document.getElementsByTagName()`或其他 DOM 方法获取到需要添加事件监听器的元素。

2. 添加事件监听器： 使用 addEventListener()`方法来为选取的元素添加事件监听器。该方法接受三个参数：事件类型、事件触发时要执行的函数、是否在捕获阶段处理事件（可选）。

示例代码如下：
// 选取元素
const button = document.getElementById('myButton');

// 添加事件监听器
button.addEventListener('click', function() {
    // 在点击事件发生时执行的操作
    console.log('按钮被点击了！');
});

在上面的示例中，当 id 为 "myButton" 的按钮被点击时，控制台会输出 '按钮被点击了！'。

除了 addEventListener() 方法外，也可以使用 on`+ 事件类型的属性来添加事件监听器，例如：
button.onclick = function() {
    // 在点击事件发生时执行的操作
    console.log('按钮被点击了！');
};

需要注意的是，使用 addEventListener() 方法可以为同一元素添加多个不同类型的事件监听器，而使用属性的方式则只能添加一个事件监听器。