本文實例講述了jQuery.extend 與 jQuery.fn.extend的用法及區別。分享給大家供大家參考,具體如下:
jQuery是一個JavaScript類,如$("#input1")
生成一個 jQuery類的實例。
jQuery為開發插件提拱了兩個方法:jQuery.fn.extend()
和jQuery.extend()
。
1、jQuery.extend()
(1)擴展 jQuery 類本身,為jQuery類添加類方法(靜態方法)
jQuery.extend({ add: function(a, b) { alert(a + b); }});jQuery.add(10,20); //30
(2)jQuery.extend(object, object1, [objectN])
用一個或多個其他對象來擴展一個對象,返回被擴展的對象
var obj = { name: 'Alice', age: 25, career: "teacher" };var object = { name: 'Bruce', career: "doctor" };jQuery.extend(obj, object); //obj = { name: 'Bruce', age: 25, career: "doctor" }
2、jQuery.fn.extend()
把對象掛載到 jQuery 的 prototype
屬性,來擴展一個新的 jQuery 實例方法,也就是通過這個 extend
添加的新方法,實例化的 jQuery 對象都能使用,因為它是掛載在 jQuery.fn
上的方法。
查看jQuery源碼可發現,jQuery.fn = jQuery.prototype
。jQuery.fn掛在原型上,由于對原型的修改會影響所有實例,因此fn上的方法會對每一個jQuery實例有效。
對jQuery.fn
的擴展,就是為jQuery類添加成員函數,jQuery類的實例可以使用這個成員函數。
jQuery.fn.extend({ clickFunc: function() { $(this).click(function(){ alert($(this).val()); }); }});$("#input1").clickFunc(); //輸出文本框的文本
3、jQuery.extend()
與 jQuery.fn.extend()
的區別
jQuery.extend()
是為jQuery類添加類方法(靜態方法),需要通過jQuery類來調用(直接使用 $.xxx 調用);
jQuery.fn.extend()
是為jQuery類添加成員函數(實例方法),所有jQuery實例都可以直接調用(需要使用 $().xxx 調用)。
更多關于jQuery相關內容感興趣的讀者可查看本站專題:《jQuery擴展技巧總結》、《jQuery常用插件及用法總結》、《jQuery切換特效與技巧總結》、《jQuery遍歷算法與技巧總結》、《jQuery常見經典特效匯總》、《jQuery動畫與特效用法總結》及《jquery選擇器用法總結》
希望本文所述對大家jQuery程序設計有所幫助。
新聞熱點
疑難解答