js中window.onload 与 jquery中$(document.ready()) 测试
生活随笔
收集整理的這篇文章主要介紹了
js中window.onload 与 jquery中$(document.ready()) 测试
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
js中window.onload 與 jquery中$(document.ready())區別，驗證代碼如下(調換js代碼和Jquer代碼書寫順序測試，運行結果一樣，因此與代碼書寫位置沒關系)：
<html> <head> <script type='text/javascript' src='jquery-1.11.1.min.js'></script> <script type='text/javascript'>$(document).ready(function(){var myDate = new Date();var hours=myDate.getHours(); //獲取當前小時數(0-23)var minutes=myDate.getMinutes(); //獲取當前分鐘數(0-59)var seconds=myDate.getSeconds(); //獲取當前秒數(0-59)var milliseconds=myDate.getMilliseconds(); //獲取當前毫秒數(0-999)console.log("【$(document).ready()】當前時間："+hours+"時"+minutes+"分"+seconds+"秒"+milliseconds+"毫秒");console.log("【$(document).ready()】先加載DOM結構,再執行當前JS,后加載大型圖片及內容");});//***************window.οnlοad=function(){ var myDate = new Date();var hours=myDate.getHours(); //獲取當前小時數(0-23)var minutes=myDate.getMinutes(); //獲取當前分鐘數(0-59)var seconds=myDate.getSeconds(); //獲取當前秒數(0-59)var milliseconds=myDate.getMilliseconds(); //獲取當前毫秒數(0-999)console.log("【window.onload】當前時間："+hours+"時"+minutes+"分"+seconds+"秒"+milliseconds+"毫秒");console.log("【window.onload】先加載DOM結構,后加載大型圖片及內容,再執行當前JS");}//*************** </script> </head> <body><pre>說明：$(document).ready()是在DOM結構載入完后執行的，而window.onload是得在所有文件都加載完后執行的；注意區別，一個是DOM加載完，一個是所有文件加載完。所謂DOM加載完，就是指DOM模型加載完，也就是指代碼加載完。兩者最大的區別，就是DOM加載完之后，不必再去等相應的圖片加載完就可以執行JS代碼了。</pre><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/></body> </html>
<html> <head> <script type='text/javascript' src='jquery-1.11.1.min.js'></script> <script type='text/javascript'>$(document).ready(function(){var myDate = new Date();var hours=myDate.getHours(); //獲取當前小時數(0-23)var minutes=myDate.getMinutes(); //獲取當前分鐘數(0-59)var seconds=myDate.getSeconds(); //獲取當前秒數(0-59)var milliseconds=myDate.getMilliseconds(); //獲取當前毫秒數(0-999)console.log("【$(document).ready()】當前時間："+hours+"時"+minutes+"分"+seconds+"秒"+milliseconds+"毫秒");console.log("【$(document).ready()】先加載DOM結構,再執行當前JS,后加載大型圖片及內容");});//***************window.οnlοad=function(){ var myDate = new Date();var hours=myDate.getHours(); //獲取當前小時數(0-23)var minutes=myDate.getMinutes(); //獲取當前分鐘數(0-59)var seconds=myDate.getSeconds(); //獲取當前秒數(0-59)var milliseconds=myDate.getMilliseconds(); //獲取當前毫秒數(0-999)console.log("【window.onload】當前時間："+hours+"時"+minutes+"分"+seconds+"秒"+milliseconds+"毫秒");console.log("【window.onload】先加載DOM結構,后加載大型圖片及內容,再執行當前JS");}//*************** </script> </head> <body><pre>說明：$(document).ready()是在DOM結構載入完后執行的，而window.onload是得在所有文件都加載完后執行的；注意區別，一個是DOM加載完，一個是所有文件加載完。所謂DOM加載完，就是指DOM模型加載完，也就是指代碼加載完。兩者最大的區別，就是DOM加載完之后，不必再去等相應的圖片加載完就可以執行JS代碼了。</pre><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/><img src='img.jpg'/><img src='img1.jpg'/><img src='img2.jpg'/><img src='img3.jpg'/><img src='img4.jpg'/></body> </html>
運行截圖：
總結：
$(document).ready()是在DOM結構載入完后執行的，而window.onload是得在所有文件都加載完后執行的；
所謂DOM加載完，就是指DOM模型加載完，也就是指代碼加載完。兩者最大的區別，就是DOM加載完之后，不必再去等相應的圖片加載完就可以執行JS代碼了。
總結
以上是生活随笔為你收集整理的js中window.onload 与 jquery中$(document.ready()) 测试的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 宝马一辆多少钱啊？
- 下一篇： 楚乔传星儿后背彼岸花为什么会消失 与风云