本文详解如何在JavaScript中通过window.addEventListener和attachEvent方法，解决多个事件处理函数执行冲突的问题。通过对比IE与非IE浏览器的实现差异，展示如何按顺序绑定多个方法，避免后赋值的函数覆盖前一个，确保所有逻辑均能执行。
解决多个JS事件处理函数执行冲突
在JavaScript开发中，常遇到这样一个问题：当代码中使用了window.onload时，可能会与HTML body标签中的onload事件产生冲突。虽然可以将所有逻辑统一写在body的onload中，或者全部封装到window.onload里，但这种做法往往不够灵活。当我们需要同时执行多个不同的事件处理逻辑时，直接赋值会导致后者覆盖前者，此时就需要借助window.attachEvent和window.addEventListener这两个方法来妥善解决。
下面介绍一种具体的解决方案。关于attachEvent和addEventListener的具体用法，读者可以通过搜索引擎进一步查阅相关资料。
具体代码实现如下：
if (document.all){
window.attachEvent('onload',函数名)//IE中
}
else{
window.addEventListener('load',函数名,false);//firefox
} IE浏览器中的attachEvent用法
在近期的开发工作中，我使用了attachEvent方法。该方法允许为特定事件附加多个处理程序，在某些场景下非常实用。这里对其基本用法进行总结。
其具体语法可参考《DHTML手册》，其中包含详细说明。此处引用一个来自互联网的例子：
代码如下：
document.getElementById("btn").onclick = method1;
document.getElementById("btn").onclick = method2;
document.getElementById("btn").onclick = method3;如果按照上述方式编写代码，最终只有method3会被执行，因为后续的赋值会覆盖之前的赋值。
写成这样：
正确的写法如下：
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系列浏览器的addEventListener用法
需要注意的是，Mozilla系列浏览器不支持attachEvent方法，此时需要使用addEventListener。
相关代码如下：
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。