document.addeventlistener

document.addEventListener 是JavaScript中的一个方法，用于向HTML文档中的一个特定元素添加事件监听器。通过监听特定的事件，我们可以在事件触发时执行自定义的代码。

该方法接受两个参数：要监听的事件类型和事件发生时要执行的回调函数。回调函数将作为事件处理程序，它会在指定的事件类型触发时被调用。

使用 document.addEventListener 方法可以为一个元素添加多个事件监听器，以响应不同的事件类型。

以下是一个简单的示例，展示如何使用 document.addEventListener 方法为一个按钮元素添加单击事件监听器：

```javascript

const button = document.querySelector('button');

function handleClick() {

console.log('按钮被单击了！');

}

button.addEventListener('click'

handleClick);

```

在上面的示例中，我们首先使用 document.querySelector 方法选择了一个按钮元素。然后，我们定义了一个名为 handleClick 的函数，该函数将作为事件回调函数执行。***，我们使用 document.addEventListener 方法将 handleClick 函数添加为按钮的 click 事件监听器。

当按钮被单击时，控制台会输出 "按钮被单击了！"。这就是事件监听器的基本工作原理。

除了 click 事件，document.addEventListener 方法还可以监听其他许多类型的事件，例如 mouseover、keydown、submit 等等。使用不同的事件类型可以实现各种不同的交互效果。

总结起来，document.addEventListener 是一个非常强大且常用的方法，它为我们提供了一种在用户与网页互动时执行自定义代码的方式。无论是创建交互式表单、响应鼠标移动还是处理键盘输入，document.addEventListener 都可以帮助我们实现这些功能。