jquery 學習之代碼風格 對于同一個對象的較多操作，建議每行寫一個操作，代碼如下： $(this).removeClass() .addClass() .stop() .fadeTo("fast",0.6) .fadeTo("fast",1) .unbind("click") .click(function(){ ??// do something! }); 對于上面的代碼，如果嫌代碼行數過多，可以以功能塊來進換行。 上段代碼中，前兩個是對class 的操作，接下來3 事動畫操作，最后是取消并重新綁定click的事件的處理函數的操作，所以可以寫成如下格式的代碼： $(this).removeClass("mouseout").addClass("mouseover") .stop().fadeTo("fast",0.6).fadeTo("fast",1) unbind("click").click(function(){ ?// do something! }); 對于多個多像的少量操作，可以每個對象寫一行，如果涉及子元素，可以考慮適當地縮進。 $(this).addClass("highlight") ???????.children("li").show().end() ?.siblings().removeClass("highlight") ???????.children("li").hiede(); javascript 中的getElementsByTagName 或者getElementById來獲取元素節點。 像這樣得到的Dom元素就是DOM對象。DOM對象可以使用JavaScript中的方法， ???var domObj = document.getElementById("id"); ???var ObjHTML= document.innerHTML; ???$("#foo").html();//獲取id為foo的元素內的html代碼。.html()是jquery里的方法。 ???這段代碼等同于: ???document.getElementById("foo").innerHTML; ????? ???在jquery對象中無法使用DOM對象的任何方法。例如$("#id").innerHTML和$("#id").checked之類的寫法都是錯誤的。 ???jquery 對象和DOM對象的相互轉換 ???在jquery 對象和DOM 對象的相互轉換之前，先約定好定義變量的風格。如果獲取的是JQuery對象，那么在變量前面加上$，例如: ???var $variable = jquery對象； ???如果獲取的是DOM 對象，定義如下： ???var variable = DOM 對象; ???如果Jquery沒有封裝想要的方法，不得不使用DOM對象的時候，有以下兩種處理方法。 ???????jquery 提供了兩種方法將一個jquery對象轉換成DOM對象，即[index]和get(index). ???????(1)Juqery對象是一個數組對象，可以通過[index]的方法得到相應的DOM對象。 ???????jqeury代碼如下： ???????var $cr = $("#cr");? //jqeury對象 ???????var cr =? $cr[0];??? //DOM 對象 ???????alert(cr.checked);?? //檢測這個checked是否被選中了。 ???????(2)另外一種方法jquery本身提供的，通過get(index)方法得到的相應的DOM 對象。 ??????jquery代碼如下： ??????var $cr = $("#cr");?? //jquery 對象 ??????var? cr = $cr.get(0); //DOM 對象 ??????alert(cr.checked);??? // 檢測這個checkbox 是否被選中了 ???DOM 對象轉成Jquery對象 ???對于一個DOM 對象，只需要用$()把DOM對象包裝起來，就可以獲得一個jQeury對象了，方式為$(dom對象)。 ???jquery 代碼如下： ???var cr = document.getElementById("cr');? //dom對象 ???var $cr = $(cr);???????????????????????? //jqeury 對象 ???通過轉換后可以可以任意使用jquery中的方法. ???? ?????

出處：http://www.cnblogs.com/liuyong/

轉載于:https://www.cnblogs.com/moyiqun/archive/2013/06/06/3121116.html

總結

以上是生活随笔為你收集整理的jQuery 学习笔记之二 (jQuery代码风格)的全部內容，希望文章能夠幫你解決所遇到的問題。

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