jQuery代碼：

　　$(document).ready(function(){

　　　　//jQuery代碼

　　});

在該函數內的所有代碼都將在DOM加載完畢后，頁面全部內容（包括圖片等）完全加載完畢前被執行。

window.onload與$(document).ready()的對比：

1、執行時機：

　　　　window.onload方法：必須等網頁中的所有內容加載完成后（包括圖片和關聯文件）才能執行。

　　　　$(document).ready()方法：網頁中所有的DOM結構繪制完畢后就執行，可能DOM元素關聯的東西并沒有加載完。

2、編寫個數：

　　　　window.onload方法：不可以同時編寫多個，不然會只執行最后一個。

　　　　$(document).ready()方法：能夠編寫多個，結果依次輸出。

3、簡寫方法：

　　　　window.onload方法：無簡寫。

　　　　$(document).ready()方法：可以簡寫成：$(function(){

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　//jQuery代碼　　

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 });

二、jQuery代碼風格

　　1、鏈式操作風格

　　（1）對于同一對象不超過3個操作的，可以直接寫成一行。

　　eg:

　　　　$("li").show().unbind("click");

　　（2）對于同一個對象的較多操作，建議每行寫一個操作。

　　eg:

　　　　$(this).removeClass("mouseout")

　　　　　　.addClass("mouseover")

　　　　　　.stop()

　　　　　　.fadeTo("fast",0.6)

　　　　　　.fadeTo("fast",1)　

　　　　　　.unbind("click")

　　　　　　.click(function(){

　　　　　　　　　//do something...

　　　　})　

　　（3）對于多個對象的少量操作，可以每個對象寫一行，如果涉及子元素，可以考慮適當的縮進。

　　　eg:

　　　$(".has_children").click(function(){
?? ??? ??? ??? $(this).addClass("highlight")
?? ??? ??? ???? .children("a").show().end()
?? ??? ?? ? ? ? .siblings().removeClass("highlight")
?? ??? ??? ? ?? .children("a").hide();
?? ??? ?});

　　 （4）對于多個對象的較多操作，建議結合第2、3條。

　　2、為代碼添加注釋

　　　　

?

?

?

?

轉載于:https://www.cnblogs.com/wuqin/p/6492288.html

與50位技術專家面對面20年技術見證，附贈技術全景圖

總結

以上是生活随笔為你收集整理的锋利的jQuery--关于$(document).ready()函数及jQuery代码风格的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。