如何為jquery添加方法

以下內容引自一位網友的帖子：

jQuery插件的開發包括兩種：

一種是類級別的插件開發，即給jQuery添加新的全局函數，相當於給jQuery類本身添加方法。jQuery的全局函數就是屬於jQuery命名空間的函數，另一種是對象級別的插件開發，即給jQuery對象添加方法。下面就兩種函數的開發做詳細的說明。

1、類級別的插件開發

類級別的插件開發最直接的理解就是給jQuery類添加類方法，可以理解為添加靜態方法。典型的例子就是$.AJAX()這個函數，將函數定義於jQuery的命名空間中。關於類級別的插件開發可以采用如下幾種形式進行擴展：

1.1 添加一個新的全局函數

添加一個全局函數，我們只需如下定義：

jQuery.foo = function() {  
  alert('This is a test. This is only a test.'); 
 };    

1.2 增加多個全局函數

添加多個全局函數，可采用如下定義：
Java代碼 

收藏代碼

jQuery.foo = function() {  
    alert('This is a test. This is only a test.'); 
 }; 
jQuery.bar = function(param) {  
   alert('This function takes a parameter, which is "' + param + '".'); 
 };  
調用時和一個函數的一樣的:jQuery.foo();jQuery.bar();或者$.foo();$.bar('bar');

1.3 使用jQuery.extend(object);　

jQuery.extend({     
 foo: function() {     
    alert('This is a test. This is only a test.');     
  },     
 bar: function(param) {     
    alert('This function takes a parameter, which is "' + param +'".');     
  }    
 }); 

1.4 使用命名空間

雖然在jQuery命名空間中，我們禁止使用了大量的javaScript函數名和變量名。但是仍然不可避免某些函數或變量名將於其他jQuery插件沖突，因此我們習慣將一些方法封裝到另一個自定義的命名空間。

jQuery.myPlugin = {         
 foo:function() {         
   alert('This is a test. This is only a test.');         
  },         
  bar:function(param) {         
   alert('This function takes a parameter, which is "' + param + '".');   
  }        
 }; 
采用命名空間的函數仍然是全局函數，調用時采用的方法： 
$.myPlugin.foo();        
$.myPlugin.bar('baz');
通過這個技巧（使用獨立的插件名），我們可以避免命名空間內函數的沖突。

2、對象級別的插件開發

對象級別的插件開發需要如下的兩種形式：、

形式1： 
(function($){    
   $.fn.extend({    
    pluginName:function(opt,callback){    
              // Our plugin implementation code goes here.      
    }    
   })    
})(jQuery);   
形式2：
(function($) {      
    $.fn.pluginName = function() {    
         // Our plugin implementation code goes here.    
    };     
})(jQuery);     
上面定義了一個jQuery函數,形參是$，函數定義完成之后,把jQuery這個實參傳遞進去.立即調用執行。這樣的好處是,我們在寫jQuery插件時,也可以使用$這個別名,而不會與prototype引起沖突.
2.1 在JQuery名稱空間下申明一個名字

這是一個單一插件的腳本。如果你的腳本中包含多個插件，或者互逆的插件（例如： $.fn.doSomething() 和 $.fn.undoSomething()），那么你需要聲明多個函數名字。但是，通常當我們編寫一個插件時，力求僅使用一個名字來包含它的所有內容。我們的示例插件命名為“highlight“   

$.fn.hilight = function() {   
   // Our plugin implementation code goes here.   
 };   
我們的插件通過這樣被調用： 
$('#myDiv').hilight();    
 

但是如果我們需要分解我們的實現代碼為多個函數該怎么辦？有很多原因：設計上的需要；這樣做更容易或更易讀的實現；而且這樣更符合面向對象。 這真是一個麻煩事，把功能實現分解成多個函數而不增加多余的命名空間。出於認識到和利用函數是javascript中最基本的類對象，我們可以這樣做。就 像其他對象一樣，函數可以被指定為屬性。因此我們已經聲明“hilight”為jQuery的屬性對象，任何其他的屬性或者函數我們需要暴露出來的，都可 以在"hilight" 函數中被聲明屬性。稍后繼續。
2.2 接受options參數以控制插件的行為

讓我們為我們的插件添加功能指定前景色和背景色的功能。我們也許會讓選項像一個options對象傳遞給插件函數。例如：  
// plugin definition 
$.fn.hilight = function(options) { 
  var defaults = { 
    foreground: 'red', 
    background: 'yellow' 
  }; 
  // Extend our default options with those provided. 
  var opts = $.extend(defaults, options); 
  // Our plugin implementation code goes here. 
}; 
我們的插件可以這樣被調用：
$('#myDiv').hilight({ 
  foreground: 'blue' 
});

2.3 暴露插件的默認設置

我們應該對上面代碼的一種改進是暴露插件的默認設置。這對於讓插件的使用者更容易用較少的代碼覆蓋和修改插件。接下來我們開始利用函數對象。    
// plugin definition 
$.fn.hilight = function(options) { 
  // Extend our default options with those provided. 
  // Note that the first arg to extend is an empty object - 
  // this is to keep from overriding our "defaults" object. 
  var opts = $.extend({}, $.fn.hilight.defaults, options); 
  // Our plugin implementation code goes here. 
}; 
// plugin defaults - added as a property on our plugin function 
$.fn.hilight.defaults = { 
  foreground: 'red', 
  background: 'yellow' 
};  
現在使用者可以包含像這樣的一行在他們的腳本里：
//這個只需要調用一次，且不一定要在ready塊中調用
$.fn.hilight.defaults.foreground = 'blue'; 
接下來我們可以像這樣使用插件的方法，結果它設置藍色的前景色：
$('#myDiv').hilight(); 

如你所見，我們允許使用者寫一行代碼在插件的默認前景色。而且使用者仍然在需要的時候可以有選擇的覆蓋這些新的默認值：
// 覆蓋插件缺省的背景顏色
$.fn.hilight.defaults.foreground = 'blue';
// ...
// 使用一個新的缺省設置調用插件
$('.hilightDiv').hilight();
// ...
// 通過傳遞配置參數給插件方法來覆蓋缺省設置
$('#green').hilight({
  foreground: 'green'
}); 



引自：http://blog.sina.com.cn/s/blog_655388ed0100uugr.html