2012年2月14日 星期二

筆記：Javascript 的 window.onload 跟 jQuery 的 .ready() 有何不同

分類：

【程式菜鳥筆記】

Q: Javascript 的 window.onload 跟 jQuery 的 .ready() 有何不同？
A: 執行的時間點不同。前者較慢，後者較快。

-- 詳解 --

Javscript 的 window.onload （也就是 jQuery 的 .load() ），要在網頁的所有 assets ，包括圖檔，全部都載入完成後，才會執行。然而， jQuery 的 .ready() ，是一旦 DOM 建構完成，就會執行，不必等那些肥大的圖檔載入。

也就是說：用 $(documnt).ready(handler) 來執行「一開頁面要處理」的事情，他執行的時間點，可以比 $(documnt).load(handler) 提早很多。

若要用到 CSS 值的話，使用 jQuery 的 .ready() 時，要把 CSS 放在 .ready() 之前。若要用到載入的資源，例如圖檔尺寸的話，那麼，程式碼就只好放在 .load() 裡面，而不能放在 .ready() 裡面。

另，jQuery 的 .ready() 方法，跟 <body onload=""> 屬性，兩者基本上是不相容的。

參考資料：.ready() – jQuery API


本文剪輯自 Google Plus。原噗按這裡（在新分頁開啟）

沒有留言:

張貼留言

訂閱： 張貼留言 (Atom)