JS（JavaScript）是基于对象（Object-based）、事件驱动的脚本语言。
JS事件，就是用户或浏览器本身的某种行为，一般是用户对页面的一些动作引起的，例如，单击某个链接或按钮、在文本框中输入文本、按下键盘上的某个按键、移动鼠标等等。当事件发生时，您可以使用 JavaScript 中的事件处理程序（也可称为事件监听器）来检测并执行某些特定的程序。JS（JavaScript）与HTML 之间的交互是通过事件（event）实现的，或者说，事件是JavaScript和DOM之间进行交互的桥梁。
一般情况下事件的名称都是以单词on开头的，例如点击事件 onclick、页面加载事件 onload 等。
JavaScript常见的事件大体分类及常用事件：
1）鼠标事件
事件 说明
onclick 鼠标单击事件
onmouseover 鼠标移入事件
onmouseout 鼠标移出事件
onmousedown 鼠标按下事件
onmouseup 鼠标松开事件
onmousemove 鼠标移动事件
2）键盘事件
onkeydown 键盘按下
onkeyup 键盘松开
3）表单事件
onfocus 获取焦点时触发
onblur 失去焦点时触发
onselect 选中“单行文本框”或“多行文本框”中的内容时
onselectstart 开始一个新的选择时
onchange 具有多个选项的表单元素选择某一项时触发
4）编辑事件
oncopy 复制（拷贝）时触发
onselect 页面内容被选取时触发
oncontextmenu 按下鼠标右键时触发
5）页面事件
onload 文档加载完成后触发
onbeforeunload 离开页面之前触发
JS的事件的处理及结果同浏览器的环境都有很大的关系，浏览器的版本越新，支持事件就越多，支持的也越完善。【HTML DOM 事件https://www.w3schools.cn/jsref/dom_obj_event.html】
事件调用通常是通过操作HTML属性的方式来实现的，可称为“事件处理器”（event handler）方式，又分为两种：在script标签中调用事件和在元素中调用事件。还有另外一种添加事件的方式，可称为“事件监听器”（event listener）方式，使用addEventListener() 和 removeEventListener()方法。
(1)在script标签中调用事件
这种方式是在JavaScript中设置事件属性。
在script标签中调用事件，指的是在< script >< /script >标签内部调用事件。语法：
obj.事件名 = function()
{
……
};
其中，bj是一个DOM对象，所谓的DOM对象，指的是使用getElementById()、getElementsByTagName()等方法获取到的元素节点。
这种事件调用方式就是操作元素的属性。只不过这个属性不是一般的属性，而是“事件属性”。
在script标签中调用事件例子源码：
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width" /> <title>在script标签中调用事件</title> <script> //window.onload可写成onload window.onload = function(){ //获取元素 var oBtn = document.getElementById("btn"); //为元素添加点击事件 oBtn.onclick = function(){ document.getElementById('field2').value=document.getElementById('field1').value; }; } </script> </head> <body> 点击下面的按钮，把文本框1的内容赋给文本框2中： <br/> 文本框1: <input type="text" id="field1" placeholder="输入文本"> <br/> 文本框2: <input type="text" id="field2" placeholder="文本"> <br/> <input id="btn" type="button" value="执行" /> </body> </html>
(2)在元素中调用事件
这种方式是在HTML中设置事件属性。
指的是直接在HTML属性中来调用事件，这个属性又叫做“事件属性”（event attributes）。
在元素中调用事件例子源码
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width" /> <title>在元素中调用事件</title> <script> function fun(){ document.getElementById('field2').value=document.getElementById('field1').value; } </script> </head> <body> 点击下面的按钮，把文本框1的内容赋给文本框2中： <br/> 文本框1: <input type="text" id="field1" placeholder="输入文本"> <br/> 文本框2: <input type="text" id="field2" placeholder="文本"> <br/> <input id="btn" type="button" value="执行" onClick=fun() /> </body> </html>
