Question

假设函数doSomething()是在同一个地方定义的，那么函数执行时的范围在这三种侦听事件的方法中是否有所不同？

<body onload="doSomething();">
document.body.onload = doSomething;
document.body.addEventListener('load', doSomething);

除了与addEventListener()相比只能包含一个“监听器”的属性之外，在这三种方式中监听事件之间是否存在其他差异？（例如传入参数，或this的值？）

Answer 1

onload="doSomething();" 类似

document.body.onload = function(event) { 
    doSomething();
};

在事件处理程序本身内部，this引用处理程序绑定的元素，但在doSomething内，this将引用window，{{3} }。 doSomething也无法访问该事件对象。如果您希望this的工作方式与其他情况相同，则必须传递event和doSomething：

onload="doSomething.call(this, event);"

注意：document，祖先DOM元素和DOM元素本身since you are calling the function "normally"（不是doSomething）的属性，这可能会导致非常混乱的行为。有关详细信息，请参阅are in the scope for the event handler。

document.body.onload = doSomething;和document.body.addEventListener('load', doSomething);在范围和上下文方面是等效的，并且他们没有内联事件处理程序具有的这种奇怪的范围行为。