JavaScript的 - 調用函數使用和不使用括號

HTML

<button id="button>click me</button>

JS - VERSION 1

window.onload = init; 

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

function buttonClickHandler() { 
    console.log('button clicked'); 
}

VS相同的HTML

JS - VERSION 2

window.onload = init();

在這兩種情況下，爲「init稱爲」出現在控制檯「立即」，但在第二種情況下，它後面是一個錯誤，說明按鈕爲空。

這裏有兩件事。 1）在版本1中，它等待DOM在版本2中加載2），它發生在DOM加載之前，或者看起來如此。

我的問題。請儘可能清楚地說明版本1中發生了什麼，以及版本2中發生了什麼。什麼是window.onload = init與window.onload = init()是什麼？另請說明每個版本的行爲。爲什麼1會等待，但2不會？

腳本需要放在按鈕元素之前，例如在頭部：http://jsfiddle.net/XMEjr/1/

來源

2013-06-01 dewd

版本1集合init功能是在window.onload事件上調用的函數。該函數不在該行上調用;它只是被分配（作爲一個值）給一個屬性。

版本2設置結果的init函數是在window.onload事件上調用的函數。這與()的不同之處在於。

顯然init函數被調用之前onload被觸發（得到該結果並將其設置爲onload處理程序）。所以函數啓動，找不到元素button id（因爲DOM還沒有準備好），所以getElementById返回null。然後試圖訪問的nullonclick財產有錯誤停止。

來源

2013-06-01 11:14:56 raina77ow

thx。我很有趣，如何寫骨幹和角碼，但甚至不知道這一點。有些人可能會說可怕的，但我繼續，並始終寫清楚可重複使用的代碼。不過，我認爲這種基本的理解能夠幫助很多事情在許多情況下都能實現。 – dewd

另外，我只是讀了一些地方，當使用window.onload = init（）會工作，如果init（）返回一個函數，例如runInit（）。然後runInit（）會在DOM加載後運行。在詢問之前，我真的需要更好的谷歌搜索，但是您一直在幫助很大。謝謝。 – dewd

不客氣。）是的，你可以運行一個返回函數的特定函數;畢竟，這是一種價值。 – raina77ow

在您指定給爲onload調用的結果，第二個給init :)

如果你這樣做是等價的：

window.onload="init()"

在這種情況下會分配一個字符串，在DOM準備就緒後進行評估。

如果你

window.onload=init

您要指派給一個函數的引用。話又說回來，當DOM準備就緒後，該函數被調用

但是，如果你這樣做：

window.onload=init()

你可以做

function init() { alert ("this is called before onload, dom is not ready, button doesnt exist"); return init2; } 

function init2() { alert ("this is called on load, dom is ready, button and everything in the body is now created"); }

希望你明白了吧。

順便說一句，這種情況下會做這樣的事情是有用的：

window.onload=init() 

function init() { 
    if (IS_IPHONE) return init_iphone; 
    if (IS_ANDROID) return init_android; 
    if (IS_WINDOWS) return init_not_supported; 
}

所以你選擇哪一個init方法來執行的onload。

來源

2013-06-01 11:19:30 rupps

JavaScript的 - 調用函數使用和不使用括號

回答

相關問題