function(event)中的event详解

目录:

一、function(event)中的event是什么?
二、为什么要加上function(event)中的event？
三、如果需要引入别的参数，那要怎么获取function(event)中的event呢？

一、function(event)中的event是什么？

event对象是个形式参数，代表事件的状态；比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。

关于event对象

在触发的事件的函数里面我们会接收到一个event对象,通过该对象我们需要的一些参数,比如说我们需要知道此事件作用到谁身上了,就可以通过event的属性target来获取到(IE暂且不谈),或者想阻止浏览器的默认行为可以通过方法preventDefault()来进行阻止.以下是event对象的一些属性和方法

属性	描述
altKey	返回当事件被触发时，”ALT” 是否被按下。
button	返回当事件被触发时，哪个鼠标按钮被点击。
clientX	返回当事件被触发时，鼠标指针的水平坐标。
clientY	返回当事件被触发时，鼠标指针的垂直坐标。
ctrlKey	返回当事件被触发时，”CTRL” 键是否被按下。
metaKey	返回当事件被触发时，”meta” 键是否被按下。

relatedTarget 返回与事件的目标节点相关的节点。 screenX 返回当某个事件被触发时，鼠标指针的水平坐标。 screenY 返回当某个事件被触发时，鼠标指针的垂直坐标。 shiftKey 返回当事件被触发时，”SHIFT” 键是否被按下。

二、为什么要加上function(event)中的event？

1. 代码规范。
2. 通过这个event，可以获取到event.target，点击对象一系列的属性。

三、如果需要引入别的参数，那要怎么获取这个function(event)中的event呢？

1、vue环境下，获取方法（亲测）
使用...arguments代表event，既不影响参数引入和获取，也和标准美观。

2、其它情况（网络推荐）

 var event = window.event || arguments.callee.caller.arguments[0]

参考文档：

https://www.cnblogs.com/websmile/p/8807334.html

https://zhidao.baidu.com/question/1772243508559247180.html

https://blog.csdn.net/qq_42341025/article/details/102582540?utm_medium=distribute.pc_relevant_bbs_down.none-task-blog-baidujs-2.nonecase&depth_1-utm_source=distribute.pc_relevant_bbs_down.none-task-blog-baidujs-2.nonecase