$（document）.ready和寫入開放式jQuery語句之間的區別

Question

寫入代碼與使用和不使用$(document).ready有什麼區別？

例如：

$(document).ready(function() { 
    $("#button").click(function() { 
     //Code 
    }); 
}); 

和：

$("#button").click(function() { 
    //Code 
}); 

和：

<input id="button" type="button" value="Cancel" onclick="hidedropdown()" /> 

    function hidedropdown() { 
     //Code 
} 

Answer 1

在第一種情況下，不執行所述代碼，直到DOM就緒。

見documentation：

傳遞給。就緒（的處理）保證後 DOM準備好執行，因此，這通常是連接的所有其他 事件處理程序和運行其他的最佳場所jQuery代碼。

如果您在位於您的HTML的起點或在頭一個script元素執行第二碼將button內容將不會被發現，並沒有事件處理程序將被約束。使用.ready修復。

將腳本放在頁面底部（與</body>相鄰）也出於同樣的原因解決了這個問題 - 在解析腳本時，HTML將被轉換爲DOM並且可以遍歷它。