Javascript中addEventListener和attachEvent的区别

在利用javascript为DOM Element添加事件处理程序时，如果要想下兼容IE6，7时，就不得不考虑addEventListener与attachEvent的异同。

1.首先说下addEventListener，现在IE9+,chrome,firefox等都支持。

所有的DOM节点包含addEventListener,并且接受3个参数：

HTMLElement.addEventListener(type,function,bool);

type：处理事件的名称，如 “click”等。

funciton：事件的处理程序。

bool：true代表的事件在捕获阶段触发，false代表在冒泡阶段出发（默认值）。

2.attachEvent是IE8及更早的IE支持的方式，由于只支持事件冒泡，所以只接受两个参数：

HTMLElement.attachEvent(type,function);

type：处理事件的名称，如 “onclick”等。（注意与addEventListener的区别）

funciton：事件的处理程序。

 

addEventListener和attachEvent的区别在于：

1. 1.很明显适用的浏览器不同。
2. 2.前者可以在事件流的不同阶段触发，后者只能在冒泡阶段触发。
3. 3.前者的事件名不用加on，后者则需要。
4. 4.为统一个事件添加多个处理程序时，处理程序的执行顺序不同。前者是按添加顺序，后者与之相反。
5. 5.两者的作用域不同。前者是在其所属的DOM的作用域中运行，后者会在全局作用域中运行。