Question

我试图在单击按钮时重新加载文档。这是我的代码：

var e = document.getElementById('a');
e.addEventListener('click',location.reload);

点击Uncaught TypeError: Illegal Invocation后返回e。但是，以下代码可以正常工作并重新加载文档：

var e = document.getElementById('a');//same thing
e.addEventListener('click',function(){location.reload()});
//warp location.reload inside function -> works!

我不明白为什么第一个代码不起作用。有人能解释一下吗？谢谢！

Answer 1

当您致电location.reload()时，它不仅会调用函数，还会将this设置为location的值，因此这两者是等效的：

location.reload();
location.reload.call(location);

但是，当您将其提供给addEventListener时，只会存储函数引用，而不会存储this的值，所以当它被称为

location.reload.call(undefined); // strict mode
location.reload.call(window); // sloppy mode

例如，Firefox提供了更明确的错误消息：TypeError: 'reload' called on an object that does not implement interface Location.

因此，为了正确行为，您需要创建一个闭包，或将this绑定到location，这样两者都可以工作：

e.addEventListener('click', function(){location.reload()});
e.addEventListener('click', location.reload.bind(location));

Answer 2

您在第一个示例中从召回函数调用中丢失（）。它应该是：

var e = document.getElementById（＆＃39; a＆＃39;）; e.addEventListener（＆＃39;单击＆＃39;，location.reload（））;

addEventListener中的location.reload

2 个答案: