2011-07-29 15 views
30

可能重複:
jquery - Is $(document).ready necessary?

把JS只是</body>標籤上面的改善感知到的加載時間,因爲瀏覽器不具備閱讀和之前它可以通過所有的JS解析開始渲染頁面。

但它有另一個好處,不是嗎?我們不需要將JS包裝到$(document).ready(function() { ... })中,因爲所有元素都已經在JS之上,因此可以進行操作了。

  1. $(document).ready必須確保DOM完全加載,並準備操作?

  2. 執行時間是否有區別?一種方法會比另一種更快嗎?

  3. 我們可以在頁面底部鏈接我們的外部JS文件(<script src="..." />)嗎?還是需要在頁眉中?

回答

18

這SO回答說NO

stackoveflow question

$(文件)。就緒是保證充分DOM可在函數被調用的時間。 不依賴於DOM的任何函數和事件都不需要放入就緒事件中。

而且 - 以提高網頁渲染速度 - 在非阻塞的方式動態地加載javascript文件:http://berklee.github.com/nbl/https://github.com/rgrove/lazyload/

這種技術的工作原理有點像這樣:

var script = document.createElement("script"); 
script.type = "text/javascript"; 
script.src = "file1.js"; 
document.getElementsByTagName("head")[0].appendChild(script); 

這個新元素將源文件file1.js。只要元素添加到頁面,該文件就開始下載。這項技術的重要之處在於,不管下載是從哪裏開始的,該文件都會被下載並執行而不會阻塞其他頁面進程。您甚至可以將此代碼放置在文檔的標題中,而不會影響頁面的其餘部分(除了用於下載文件的一個HTTP連接外)。

本書:Nickolas Zakas撰寫的「高性能JavaScript」有很多關於JavaScript性能優化的有趣信息。

相關問題