事件的概念:

事件类型:在下方总结的各种事件就是事件类型
事件源:触发这个事件的元素就叫事件源
事件监听器:就是浏览器,使用addEventListener的方法添加事件监听器。关于事件监听器的更多介绍请看:https://blog.csdn.net/weixin_43606158/article/details/90728664
事件处理程序(函数):当你触发事件以后要执行的代码块就是事件处理程序。

鼠标事件:

  • 右键点击: oncontextmenu
  • 左键单击: onclick
  • 鼠标左键双击: ondblclick
  • 某个鼠标键被按下: onmousedown
  • 某个鼠标键被松开: onmouseup
  • 移动事件: onmousemove
  • 移入事件: onmouseover(PS:有事件冒泡,即从后代元素上移动经过,会重复触发事件)
  • 移出事件: onmouseout
  • 移入事件:onmouseenter (PS:无事件冒泡,即从后代元素上移动经过,不会重复触发事件)
  • 移出事件: onmouseleave

键盘事件:

  • onkeydown: 某个键盘的键被按下
  • onkeypress:某个键盘的键被按下或按住
  • onkeyup:某个键盘的键被松开

Input事件:

  • onchange:用户改变域的内容
  • oninput: 输入框事件
  • onsubmit:表单提交事件
  • onselect:文本被选定

全局事件:

  • onfocus:元素获得焦点
  • onblur:元素失去焦点
  • onload:某个页面或图像被完成加载
  • onresize:窗口或框架被调整尺寸
  • onunload:用户退出页面
  • onreset:重置按钮被点击
  • onerror:当加载文档或图像时发生某个错误
  • onabort:图像加载被中断
  • oncopy: 复制事件
  • onpaste: 粘贴事件
  • oncut: 剪切事件
  • onbeforeunload: 浏览器刷新事件会触发

event对象:

作用:
代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。。。

获取方法:

  • 标准:事件函数的第一个参数
  • 非标准(IE9之前):window.event
  • 兼容写法:event = event || window.event;

关于event鼠标的属性获取请看:最全的获取鼠标坐标的详细解析

键盘属性:

//获取键盘按键的虚拟键盘码
event.which 
event.keyCode

//获取是否按下了键盘上的ctrl键
//返回true表示按下了ctrl并保持按下状态
event.ctrlKey

//获取是否按下了键盘上的shift键
event.shiftKey

//获取是否按下了键盘上的alt键
event.altKey

所有的事件都会持续更新。。。
笔者项目开发过程中用到一个就会总结一个