通常我們想要在頁面內容加載完成後運行 JS 時，都會使用 window.onload 來處理，比如：
<script language="javascript">
window.onload = function () {
alert('Hello World! ');
}
</script>
這段代碼將在頁面載入完成後彈出一個 "Hello World!" 的警告框，但是眾所周知，window.onload 的特點是頁面元素全部加載完成後才執行，比如頁面內有大量的圖片之類，當打開網頁時，其實相關的 DOM 已經全部加載完成，此時已經可以執行你想要執行的腳本了，可是圖片的加載速度要很慢於頁面的 HTML，這顯然在大多數情況下不是我們想要的。
jQuery 提供一個 $(document).ready(); 來解決此問題，當頁面 DOM 加載完成後，ready() 裡的函數便會立即執行，但如果我們在不使用 jQuery 的情況下呢？
好了，廢話不多說，大家都明白想要什麼，以下是來自國外網站的一段代碼，功能同等於 jQuery 的 $(document).ready();
看代碼：
<script language='javascript'>
(function () {
var ie = !!(window.attachEvent && !window.opera);
var wk = /webkit\/(\d+)/i.test(navigator.userAgent) && (RegExp.$1 < 525);
var fn = [];
var run = function () { for (var i = 0; i < fn.length; i++) fn[i](); };
var d = document;
d.ready = function (f) {
if (!ie && !wk && d.addEventListener)
return d.addEventListener('DOMContentLoaded', f, false);
if (fn.push(f) > 1) return;
if (ie)
(function () {
try { d.documentElement.doScroll('left'); run(); }
catch (err) { setTimeout(arguments.callee, 0); }
})();
else if (wk)
var t = setInterval(function () {
if (/^(loaded|complete)$/.test(d.readyState))
clearInterval(t), run();
}, 0);
};
})();
</script>
把這段代碼放到你的頁面中或者某個導入的腳本中，然後你就可以像下面這樣使用了：
<script language='javascript'>
document.ready(function(){
alert('Document is ready! ');
});
</script>
打開頁面，看到效果沒？YES，這就是去掉了 $(); 的 document.ready(); 咱不再依賴 jQuery，但如果你的站點已經使用了 jQuery，就不用再多此一舉了。
其實 window.onload 也並非是一無用處，很多情況下一些B/S軟件需要頁面全部加載後才提供用戶相關功能，這樣 window.onload 就可以提供一種“加載中”的功能，又或者是頁面內容很少，完全無需 document.ready(); 根據各種情況，應該合理的使用 onload 和 ready。