js中的常见事件（鼠标事件，键盘事件，表单事件......）
JavaScript中的事件(Event)是指在网页中发生的某些特定操作（例如单击、加载页面等），可以被JavaScript代码捕获和处理。常见的事件有：
-
鼠标事件：单击（click）、双击（dblclick）、鼠标移动（mousemove）、鼠标悬停（mouseover）、鼠标离开（mouseout）等。
-
键盘事件：按键（keydown）、释放键（keyup）等。
-
表单事件：提交表单（submit）、重置表单（reset）、输入（input），改变（change）、获得焦点（focus）、失去焦点（blur）等。
-
文档事件：加载完成（load）、窗口大小改变（resize）、关闭页面（unload）等。
通过注册事件监听器（Event Listener），可以为网页元素（例如按钮、链接等）添加事件处理器（Event Handler），当事件发生时，事件处理器会被调用执行相应的代码。
例如，下面的代码使用addEventListener()方法为一个按钮添加单击事件的处理函数：
鼠标事件是最常用的事件，通常我们的前后端交互都是通过点击事件来完成的。
const button = document.querySelector('button');
button.addEventListener('click', function() {console.log('按钮被单击了！');
});
鼠标悬停事件：鼠标悬停时弹出信息提示
<html><body>
//鼠标悬停该按钮时显示提示
<button id="btn">查询</button> //通过span做提示，默认为display：none
<span id="info" style="display:none">一个查询按钮</span></body>
</html><script>var info=document.getElementById("info")var btn =document.getElementById("btn")btn.onmouseover=function(){//鼠标悬停时，提示文字显示出来info.style.display="inline-block"；}btn.onmouseout=function(){//鼠标离开时，提示文字隐藏info.style.display=""；}</script>本文着重说一下表单时间。
表单事件是指在表单元素中发生的事件，例如提交表单、重置表单、输入等。常用的表单事件有：
-
submit事件：表单提交时触发。
-
reset事件：表单重置时触发。
-
input事件：输入框内容改变时触发。
-
change事件：表单元素的值发生改变时触发（例如复选框、下拉列表等）。
-
focus事件：获得焦点时触发（点击输入框：input textarea）；
-
blur事件：失去焦点时触发（当在输入框中输入文本之后切换至下一个输入框，上面这个就会失去焦点）
这些事件可以通过addEventListener()方法来注册事件监听器，例如：
const form = document.querySelector('form');
const input = document.querySelector('input');form.addEventListener('submit', function(event) {event.preventDefault(); // 阻止表单默认提交行为console.log('表单已提交！')
});input.addEventListener('input', function(event) {console.log('输入框内容已改变：', event.target.value);
});
也可以通过给html标签直接添加事件完成
html：<input type='text' name='username' oninput='changeINfo()' />js:function changeInfo(){//实时显示输入框中的输入字数console.log(document.getElementByName("username")[0].value.length)}在submit事件的处理函数中，可以使用event对象的preventDefault()方法阻止表单的默认提交行为，从而实现自定义表单行为。在input事件的处理函数中，可以通过event.target.value获取输入框的当前值，并在控制台中输出。
文档事件
我们说一下load事件；load事件是在页面初始化时调用，常用于初始化界面的数据（一个查询列表的初始化显示查询）。
举个例子：
在刚打开界面时给出一个弹出框
<script>window.onload=function(){//这里我们可以初始化查询一个后端数据ajax。。。//也可以在界面刚打开时进行一个操作（打开一个广告界面。。。）//我们拿一个弹出框模拟一下alert("xxx")
}</script>