addEventListener和attachEvent二者绑定的执行函数中的this不相同

　　写 addEventListener 和 attachEvent 区别的博文不少，不过大部分都把重点放置于前者是Firefox chrome，后者只是存在于IE系列中。

　　最近在写一个事件代理的时候，遇到一个BUG，发现除此外，二者绑定的执行函数中的 this 是不相同的，addEventListener 和 attachEvent函数在运行时候的上下文是不相同的。

　　用了一个简单的demo来描述这个不同点：

复制代码代码如下:

　　<<head>

　　<<title>测试</title>

　　</head>

　　<<body>

　　</div>

　　<<div id="div2">

　　</div>

　　</body>

　　<<script type="text/javascript">

　　var testGolb = "diff"; // 定义一个全局变量

　　var a1 = document.getElementById( "a1");

　　var a2 = document.getElementById( "a2");

　　function getEleId ( e) {

　　// body...

　　alert( this.id);

　　alert( this.testGolb);

　　}

　　a1.onclick = getEleId;

　　if( a2.attachEvent){

　　a2.attachEvent( "onclick", getEleId);

　　}else{

　　a2.addEventListener( 'click',getEleId);

　　}

　　</script>

　　</html>

　　点击 test1

　　chrome 下第一次alert:" a1",第二次alert :"undefined"

　　firefox 下第一次alert:" a1",第二次alert :"undefined"

　　IE 中第一次alert:" a1",第二次alert :"undefined"

　　这很好理解，这时候的this指向 #a1 这个DOM，所以alert id是 #a1的id “a1”，然后在this中，并没有testGolb这个变量，所以是undefined

　　点击 test2

　　chrome下第一次alert:" a1",第二次alert :"undefined"

　　firefox 下第一次alert:" a1",第二次alert :"undefined"

　　IE 中第一次alert:" undefined",第二次alert :"diff"

　　chrome 和 firefox同点击test1时候的表现是一致的，而IE就不同了。使用attachEvent绑定事件时候，函数中的this指向的是window，并不是添加事件的dom，所以第一次的alert 值是 undefined,而this.testGlob 的值是diff。