JavaScript 事件监听器 addEventListener() 方法 和一些基本的事件

addEventListener() 方法用于在指定元素上添加事件监听器，以便在某个事件发生时执行一段脚本代码。

以下是一些基本的事件类型和相应的使用示例：

1. 鼠标单击事件 (click):

document.getElementById("myButton").addEventListener("click", function() {
    alert("按钮被点击了！");
});

2. 鼠标悬停事件 (mouseover):

document.getElementById("myElement").addEventListener("mouseover", function() {
    this.style.color = "red";
});

3. 输入框值变化事件 (input):

document.getElementById("myInput").addEventListener("input", function() {
    console.log("输入框的值变为：" + this.value);
});

4. 窗口加载事件 (load):

window.addEventListener("load", function() {
    console.log("页面加载完毕！");
});

5. 窗口大小改变事件 (resize):

window.addEventListener("resize", function() {
    console.log("窗口大小已改变，宽度为：" + window.innerWidth);
});

addEventListener() 方法可以用来监听大量的事件类型，包括键盘事件 (keydown, keyup), 表单事件 (submit, change), 滚动事件 (scroll) 等。使用时确保事件类型字符串与你想要监听的事件相匹配。