一、HTML事件处理程序，在html中的写法： <input type="button" οnclick="hello()" />。缺点是html和js代码紧密的耦合在一起，不利于修改维护，修改的时候可能需要更改多处。不能给元素添加多个事件处理程序，如果有多个，只会运行第一个。

如果不想要事件处理程序了，必须从html代码中删除事件处理代码。

—————————————————————————————————————————————————

二、DOM0级事件处理程序 在js中的写法：element.οnclick=function(){}，或者element.οnclick=btnclick。是一种比较传统的方式：把一个函数(或者匿名函数)赋值给一个事件的处理程序属性。优点：简单，跨浏览器的优势（兼容所有浏览器）。

缺点：不能给元素添加多个事件处理程序，只能添加一个，如果添加多个事件处理程序，后面的会覆盖前面的。

如果不想要事件处理程序了，我们可以在下面写成element.οnclick=null;DOM0级删掉已有事件的方法都可以这么写，这样的删除事件的方式只能删除DOM0添加的事件。

注意：是把一个函数赋值给一个事件的处理程序属性，一定不能把函数执行赋值给事件处理程序属性，即不能加()。

—————————————————————————————————————————————————

三、DOM1级主要隐射文档没有事件

DOM1级有DOM Core和DOM HTML组成，前者针对XML文档后者针对HTML文档，DOM1级主要是隐射文档结构。制定的时候没有制定事件上的东西，

—————————————————————————————————————————————————

四、DOM2级事件处理程序，定义了两个方法，在js中的写法： 

添加事件：element.addEventListener('click',function(){},false)//false指的是冒泡，早期浏览器都支持冒泡，为了兼容基本上最后一个参数都是false

删除事件：element.removeEventListener('click',function(){},false)，这样的删除方式只能删除DOM2级添加的事件。删除的时候传递的参数必须跟添加时传递的参数一样才能正确删除事件。

优点，可以给元素添加多个事件处理程序，这些事件处理程序按照他们的顺序执行。

注意：所有的on都必须去掉，所有的onclick都是需要写成click。

如果把方法封装一下，并且把代理也加上，代码如下：

注意：DOM2级事件处理程序，函数里面也可以直接用this，this代表的是点击的按钮，比如里面可以写this。value等。

有代理的话用第一种，没有代理用第二种（代理指的就是冒泡里面用的上一级代理）

代理的两个优点：

1）代码比较简洁，绑定一次事件就可以了，不用绑定很多次

2）给浏览器的压力比较小，在页面上执行一堆js和在页面上执行一两句js，对浏览器的压力是不一样的，效率会高一些。

IE事件处理程序，IE不支持addEventListener()和removeEventListener()，但是他有两个类似于addEventListener()和removeEventListener()的方法是attachEvent()和detachEvent()，在js中的写法：

添加事件：element.attachEvent('onclick',function(){})

删除事件：element. detachEvent('onclick',function(){})

注意，IE事件处理程序没有第三个参数，因为IE早期版本只支持事件冒泡，所以默认就是事件冒泡。

注意：在IE事件处理程序中所有的on不能去掉，所有的onclick还需要写成onclick。

跨浏览器的事件处理程序（用能力检测）参考http://www.imooc.com/video/2138

element.οnclick===element['onclick']//true

—————————————————————————————————————————————————

DOM3级事件处理程序，在js中的写法：  element.addEventListener('keyup',function(){},false)//DOM3级事件处理跟DOM2级事件处理方法一样，就是增加了许多事件类型，包括鼠标事件，键盘事件。