IE的attachEvent中的'this'是什么？

Question

我厌倦了写jQuery，所以我决定学习一些纯JavaScript。 在IE的attachEvent中有些让我困惑的地方。下面是代码：

var btn = document.getElementById('myBtn');
    
btn.onclick = function(){
   alert(window.event.srcElement === this); //true, I know why.
};
        
btn.attachEvent('onclick', function(event){
   alert(event.srcElement === this); //fasle, but why?
});

我试图使用IE内置的调试工具，但它只告诉我'this'是一个对象，没有更多的信息... 那么在IE的attachEvent中，'this'是什么？

- shawjia

---

尝试将 this 输出到控制台并查看。使用 console.log(this)。 - Joseph

我尝试了，但IE只告诉我它是一个对象，没有更多的信息。 - shawjia

你发现了错别字“srcElemnt”吗？如果没有“e”，那么该事件属性将未定义（并且！== this）。 - Bergi

只是一个打字错误，已经修复。仍然返回false。 - shawjia

Answer 1

在使用IE浏览器特有的attachEvent方法绑定事件处理程序时，this指向全局的window对象：

btn.attachEvent('onclick', function(event) {
    alert(this === window); // true
}

相比之下，使用标准的addEventListener方法绑定的事件处理程序中，this指向触发事件处理程序的DOM元素。

- Michael Liu

Answer 2

我觉得你拼错了一个单词。

    btn.attachEvent('onclick', function(event){
            alert(event.**srcElement** === this);
    });

我在Chrome和Firefox中测试了相应的addEventListener函数，它们都返回true。

但是IE返回false。可能是因为IE以不同的方式处理btn.onclick=fn;和btn.attachEvent()。IE将全局值（window）传递给btn.attachEvent()方法。您可以测试this=== window，它会返回true。

对此有什么评论吗？

- trinity

Answer 3

这是一个上下文引用，当点击事件发生时，它引用窗口，因为那时候只有这个上下文存在。

- dbrin