JavaScript - 使用和不使用parens调用函数

dew*_*ewd 0 javascript

请使用以下代码:

HTML

<button id="button>click me</button>
Run Code Online (Sandbox Code Playgroud)

JS - 版本1

window.onload = init;

function init() {
    console.log('init called');
    var button = document.getElementById('button');
    button.onclick = buttonClickHandler;
}

function buttonClickHandler() {
    console.log('button clicked');
}
Run Code Online (Sandbox Code Playgroud)

vs相同的HTML

JS - 版本2

window.onload = init();
Run Code Online (Sandbox Code Playgroud)

在这两种情况下,"init called"会立即出现在控制台中,但在第二种情况下,会出现一个错误,指出按钮为空.

这里有2件事情在玩.1)在版本1中,它等待DOM在版本2中加载2),它在DOM加载之前发生,或者看起来如此.

我的问题.请尽可能清楚地解释版本1中发生的情况与版本2中发生的情况.什么window.onload = init是vs什么window.onload = init()是技术术语?还请解释每个版本的行为.为什么1等待,但2不等?

脚本需要在按钮元素之前,例如在头部:http://jsfiddle.net/XMEjr/1/

rai*_*7ow 9

版本1将init函数设置为调用window.onload事件的函数.该行未调用该函数; 它只是被赋予(作为一个价值)一个属性.

版本2将函数的结果设置为init调用window.onload事件的函数.这是有区别的().

显然init函数在onload被触发之前被调用(以获得该结果并将其设置为onload处理程序).所以函数启动,无法按buttonid 找到元素(因为DOM还没有准备好),所以getElementById返回null.然后尝试访问onclick属性null停止它有错误.