本文详解JavaScript中attachEvent与addEventListener两种事件绑定方法的差异。重点对比IE与非IE浏览器对事件处理函数的执行顺序：attachEvent为逆序执行，addEventListener为正序执行。同时提供结合if-else判断的通用兼容代码示例，确保在旧版IE与现代浏览器中均能正确绑定事件。
attachEvent与addEventListener的基本概念
在JavaScript中，attachEvent方法常用于处理按钮的onclick事件。
而addEventListener方法则对应处理按钮的click事件。
这两种方法的核心区别在于它们处理事件监听器的优先级和执行顺序不同，具体原理通过以下实例进行说明。
attachEvent方法的作用是为指定事件附加额外的处理程序，但该特性仅支持旧版Internet Explorer浏览器，不支持Mozilla系列浏览器（如Firefox）。
addEventListener方法则是Mozilla系列浏览器（如Firefox、Chrome等标准浏览器）所支持的标准事件绑定方式。
事件执行顺序对比
具体使用示例如下：
Java代码
代码如下:
document.getElementById("btn").onclick = method1;
document.getElementById("btn").onclick = method2;
document.getElementById("btn").onclick = method3;若采用上述直接赋值的方式编写代码，最终只有method3会被执行，因为后续赋值会覆盖前面的赋值。
为了实现多个方法的顺序执行，可以改用以下写法：
Java代码:
代码如下:
var btn1Obj = document.getElementById("btn1");
//object.attachEvent(event,function);
btn1Obj.attachEvent("onclick",method1);
btn1Obj.attachEvent("onclick",method2);
btn1Obj.attachEvent("onclick",method3);此时，事件的执行顺序为method3 -> method2 -> method1，即后绑定的方法先执行。
对于Mozilla系列浏览器，由于不支持attachEvent方法，需要使用addEventListener来实现事件绑定。
Java代码
代码如下:
var btn1Obj = document.getElementById("btn1");
//element.addEventListener(type,listener,useCapture);
btn1Obj.addEventListener("click",method1,false);
btn1Obj.addEventListener("click",method2,false);
btn1Obj.addEventListener("click",method3,false);在此模式下，事件的执行顺序为method1 -> method2 -> method3，即先绑定的方法先执行。
浏览器兼容处理实例
以下是具体的应用实例：
1。 Java代码:
代码如下:
var el = EDITFORM_DOCUMENT.body;
//先取得对象，EDITFORM_DOCUMENT实为一个iframe
if (el.addEventListener)...{
el.addEventListener('click', KindDisableMenu, false);
} else if (el.attachEvent)...{
el.attachEvent('onclick', KindDisableMenu);
} 2。 Java代码:
代码如下:
if (window.addEventListener){
window.addEventListener('load', _uCO, false);
} else if (window.attachEvent){
window.attachEvent('onload', _uCO);
}