資源描述：
《如何編寫自己的jquery插件》由會員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在工程資料-天天文庫。
1、如何編寫自己的jquery插件Jquery的插件主要分為三類：、封裝對象方法的插件：大部分插件都是封裝對象的插件、封裝全局函數(shù)的插件：將獨(dú)立的函數(shù)添加到j(luò)query的命名空間之下。Jquery.ajax()和jquery.trim()就是jquery內(nèi)部作為全局函數(shù)的插件添加到內(nèi)核上去的。、選擇器插件：擴(kuò)充自己喜歡的一些選擇器。編寫Jquery插件的基本要點(diǎn)：、一般命名的時(shí)候最好是按照jquery.[插件名].js命名。、所有的對象都應(yīng)當(dāng)附加到j(luò)query.fn對象上，所有的全局函數(shù)應(yīng)該附加到j(luò)query對象本身上、通過this.each()來便利對象，這里的this指向的是當(dāng)前選擇器
2、通過選擇器獲取的jquery對象、所有的方法或者函數(shù)插件都要以分號結(jié)尾，否則壓縮的話就會出現(xiàn)問題，有時(shí)候甚至要在頭部也要加上“;”,以免不規(guī)范的代碼給寫的插件帶來影響。插件應(yīng)當(dāng)返回一個(gè)jquery對象，以便可以進(jìn)行鏈?zhǔn)讲僮?，除非你是要返回某個(gè)特定類型的參數(shù)，比如字符串和數(shù)組。要注意$和jquery兩個(gè)符號的沖入，可以利用閉包這種技術(shù)來回避這個(gè)問題。允許使用內(nèi)部函數(shù)，而且，這些內(nèi)部函數(shù)可以訪問他們所在的外部函數(shù)中聲明的局部變量參數(shù)和聲明的其他的內(nèi)部函數(shù)，當(dāng)其中一個(gè)這樣的內(nèi)部函數(shù)在包含他們的外部函數(shù)之外被調(diào)用時(shí)，就會形成閉包?！伴]包”是一個(gè)很復(fù)雜的概念，對于編寫jquery插件其實(shí)是有一個(gè)
3、模板的，這個(gè)模板中就有用到閉包的概念。常見的jquery插件的都是有如下的格式的：;(function($){$.fn.yourName=function(options){//各種屬性、參數(shù) }varoptions=$.extend(defaults,options);//定義參數(shù)this.each(function(){//插件實(shí)現(xiàn)代碼});};})(jQuery);注解：(1)、“;(function($){})(jQuery);”使用了匿名函數(shù)，表示在方法體內(nèi)的”$”表示的就是”jquery”,為了有更好的兼容性，所以在前面添加一個(gè)分號,這里的$符號是作為匿名函數(shù)的形參(2)
4、、$.extend(defaults,options);表示的是如果options中的參數(shù)總是有值的話，那么options中的值將會代替defaults中的值。舉個(gè)例子來說：Varsetting={validate:true,limit:5,name:foo};Varoptions={validate:fasle,name:tom};Varnewoptions=$.extend(setting，options)；maintenancemeasures,thereisabigsecurityrisk,managementhashadagreatimpacttothecity.3.1-8b
5、usterminalstationstatusinYibincitylayouts(4)hoursofoperationmostofYibincitybuslinesin5:30-6:20,andbasicallymeettheYibintravelneeds.Bus那結(jié)果就是newoptions={validate:false,limit:5,name:tom}.所以Jquery.extend()(或者是$.extend())經(jīng)常來設(shè)置插件的一些默認(rèn)的參數(shù)。還有就是$.extend()用來擴(kuò)展方法，和jquery.fn.extend()一樣都是可以的，他們的區(qū)別在于：前者不使用jqu
6、ery的方法，而后者使用了jquery的方法，就像addClass(),remove()等。所以可想而知大部分的現(xiàn)有插件都是jquery.fn.extend()進(jìn)行擴(kuò)展的。functionfoo(options){ options=jquery.extend({ Name：“bar”, Length：5， dataType:”xml” },options);};如果options參數(shù)傳入的值為空，那么就可以使用默認(rèn)設(shè)置的值。例子:;(function($)){ $.fn.extend({ “functionname”：function(options){//某個(gè)方法名
7、Options=$.extend({ odd:”odd”, even:”even” },options); //可以通過options.元素名稱來獲取元素之，如options.odd //somecodes $(“.table”).addClass(“”);//為某個(gè)元素添加樣式等等 } //一個(gè)方法結(jié)束 //另一個(gè)方法this.cleartb=function(){//同時(shí)你也可以這么寫，這里cleartb就是方法的名稱$(
