jquery插件開發(fā)一般有兩種方法:

創(chuàng)新互聯(lián)建站成立與2013年，先為東鄉(xiāng)族等服務建站，東鄉(xiāng)族等地企業(yè)，進行企業(yè)商務咨詢服務。為東鄉(xiāng)族企業(yè)網站制作PC+手機+微官網三網同步一站式服務解決您的所有建站問題。

1?通過$.extend()來擴展,寫成jQuery.extend()也可以的

2?通過$.fn.extend()來進行擴展,也可以寫成jQuery.fn.extend()

第一種方法，相當于在$身上添加了一個全局函數，如果和后臺java、c#類比的話，就是相當于在

$或jQuey這個類上添加了一個靜態(tài)的方法(函數)

那怎么寫?

把通過第一種方法擴展的插件寫在這個common.js文件里，然后在index.html頁面去測試

代碼：

非常簡單的一行代碼

然后看index.html頁面調用

然后看控制臺輸出:

一切都是妥妥的，沒毛病，而且其他頁面如果引用了，都能使用這個方法。

但是如果需要定義多個全局的函數，通常我們用面向對象的思想來編寫。

例如：

將所有的成員都掛在一個對象上，或者說是放在一個命令空間里。這樣做的好處就是，不用定義太多的外部變量，避免引起沖突。

調用:

調用的話就是: $.對象名.成員。

結果:

當然我們也可以用jQuery提供給我們用于擴展用的行數extend()

例如:

調用:

結果:

前面的這些都屬于第一種方法的范疇，本質就是在$上添加全局函數就可以了。

再看第二種方式$.fn.extend()，這種方式相當于給$的每一個實例對象添加方法(函數)

首先我們要知道fn是個什么鬼，查看jQuery源代碼，會發(fā)現這樣的一行代碼:

說明我們就是在原型上去做的擴展。

例如:

注意:index是對應的索引，ele對應的是每一個dom元素對象

最后一樣的return是用于支持鏈式調用的。

調用:

最后的效果:

如果要擴展多個方法，這個時候就需要這樣寫了

顯然比較麻煩！

還是一樣可以使用jQuery提供給我們的方法(函數)$.fn.extend()

如果要擴展多個就可以這樣寫了

調用:

能夠鏈式操作。

效果如圖所示:

總結:

jQuey插件編寫的兩種方式:

1 $.extend();???? // 在全局上添加函數 相當于靜態(tài)方法(類比C#)

2 $.fn.extend();??? // 相當于給jquey對象添加?? 相當于實例方法(類比C#)

再補充一點:

這個外面的this和里面的這個this不是同一個對象

查看其結果:

注意里面的每一個this對象都是dom對象

文章名稱：jquery插件編寫簡單總結
新聞來源：http://m.rwnh.cn/article44/jejihe.html

成都網站建設公司_創(chuàng)新互聯(lián)，為您提供網站導航、自適應網站、App設計、App開發(fā)、響應式網站、手機網站建設

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)