前话

曾经在看别人的代码和学习一些教学视频的时候，发现从不同的地方看到的代码，实现的逻辑是一样的，但是对事件的写法却各不一样，比如下面是两个人写的代码，实现的逻辑省略了，但是一样的。

人一
document.getElementById("id").onclick = function(event){
//逻辑代码省略 …………
}
人二
document.getElementById("id").onclick = function(e){
//逻辑代码省略 ………………
}

从上面的代码中，我们看见两个人都是获取同一个dom节点，然后在上面作点击逻辑操作，但是为什么一个人写的是event，而另外一个人写的却是e呢，难道可以随便写吗？我一直对此百思不得其解，于是我采取了死记硬背的老方法把它记作准则来用，可是随着后面对js了解的加深，才得知其中深意。

要搞明白这里为什么事件的名字可以随便写的问题，首先得先了解js的函数的参数机制！js的参数可以随便写的，并且可以不限制个数，所以你可以写n个参数，但是在函数体中可能只用到几个参数，或者根本没有用参数也是没有问题的，像下面的代码，这是为什么呢！

function fun(arg1,arg2,arg3,arg4,……){
//函数根本没有用参数或者只用了arg1和arg2……
}

实际上，js在运算的过程中，并不是从你定义的参数中去调用参数，而是从它的arguments去取参数，这个arguments类似于数组，可以通过取下标的方法取得对应的参数，比如arguments[0]可以取得arg1,arguments[1]可以取得arg2等，以此类推。比如下面的两个函数实现的最终结果是一样的！

function fun(num1,num2){
if(typeof num1 !== 'number' || typeof num2 !== 'number'){console.log("请输入十进制数");return;};
var sum = num1+num2;
console.log(sum);
}
fun(3,4) //结果为7
function fun1(num1,num2){
if(typeof arguments[0] !== 'number' || typeof arguments[1] !== 'number'){console.log("请输入十进制数");return;};
var sum = arguments[0] + arguments[1];
console.log(sum);
}
fun1(3,4); //结果为7

那么这个arguments和你显示定义的参数是什么关系呢！其实他们是一种对应关系，通过对arguments取对应的下标可以得到对应的参数，下标是从0开始的，比如下面的代码！

function fun(arg1,arg2){
console.log(arg1 == arguments[0]);//结果为true
console.log(arg2 == arguments[1]);//结果为true
}

基于此种关系，js的函数的参数定义可以很灵活，无论你定义了多少个参数，你都可以从arguments中取到。那么回到事件那里的代码,为什么写event或者e，甚至其它任意字符都可以呢！其实，在有事件发生时，等号右边的匿名函数的默认含有一个参数并且是一个事件对象，也就是arguments[0]为Event的一个实例，我们可以用下面的代码看它返回的是什么，就清楚了！

document.body.onclick = function(){
alert(arguments[0] instancof Event);
};

所以到这里，我们可以知道事件名字在这里可以随便写了，因为无论你写什么，它都对应的是arguments[0],因为你对应的第一个参数对应arguments[0]。如下代码（注：在ie8中ie8之前这里存在问题，arguments[0]并不是事件对象的实例，并且并没有含有默认参数！可以测试代码document.body.onclick = function(){ console.log(arguments); }便知道。）

document.body.onclick = function(e){
alert(e == arguments[0]);
}

但是你像下面这样写就有问题了；

document.body.onclick = function(){
alert(e);//会报错，因为你e未定义
};

上面的变量e并不是存在右边匿名函数中，所以它并不对应于arguments[0],如果非要采用这种方式的话，可以使用event，因为这是个关键字，默认在匿名函数中指代事件对象实例！

Event事件兼容

事件的兼容主要是ie浏览器和其它浏览器的兼容问题，ie的事件对象是挂在window的属性上的，并且早期当事件发生时，并不存在第一个参数是事件对象的实例！所以为了获得事件对象，需要像下面这样写:

var e = event || window.event;
并且最好在事件匿名函数定义传入参数event，如：
document.body.onclick = function(event){
var e = event || window.event;
//后续代码省略
}

事件分类

待续……………………