jQuery.extend和jQuery.fn.extend的區別

jQuery.extend和jQuery.fn.extend的區別,其實從這兩個辦法本身也就可以看出來。很多地方說的也不詳細。這裏詳細說說之間的區別.


我們先把jQuery看成了一個類,這樣好理解一些。
jQuery.extend(),是擴展的jQuery這個類。
假設我們把jQuery這個類看成是人類,能吃飯能喝水能跑能跳,現在我們用jQuery.extend這個方法給這個類拓展一個能唱歌的技能。這樣的話,不論是男人,女人,xx人.....等能繼承這個技能(方法)了。
可以如下這樣寫着:   

jQuery.extend({
   dong:function(){
       alert("dong");
   }
});
然後:$.dong();這樣就能打印出來”dong“這個字符串

代碼在下面:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
	<head>
		<title>jquery.test</title>
		<script type="text/javascript" src="../js/modules/jquery/jquery.js"></script>
		<script type="text/javascript">
			$(function($){
				$.extend({
					dong:function(){
						alert("dong");
					}
				});
			})(jquery);
		</script>
		<script type="text/javascript">
			$(document).ready(function(){
				$.dong();
			});
		</script>
	</head>
	<body></body>
</html>


這說明.dong()這個方法變成了jquery這個類本身的方法了,而並不是某一個實例對像的方法。也就是說這個能力只jQuery這個類能使用,這個擴展也就所謂的靜態擴展有,這個只與這個類本身有關,而與某個實例無關。

下面再來看看jQuery.fn.extend(),首先看下jQuery.fn是個什麼東東,看下源碼:

jQuery.fn = jQuery.prototype = {
	// The current version of jQuery being used
	jquery: core_version,
        ......
}

也就是說jquery.fn是原型,那就比較清楚了,jquery.fn.extend()擴展是jquery對像(原型)的方法,對像是啥,就是類的實例化,如:$(“#ddd”)就是jquery實例化的一個對象

jquery.fn.extend()就必須使用在實例化的對象上。比如lin()是這樣一個擴展,那麼可以這樣使用:

$("selector").lin(); 而不能這樣$.lin()使用。


看到這裏與上面的區別就已經很清楚了,jquery.extend()主要用來擴展全局方法,例如:$.ajax()。而jquery.fn.extend()則主要用來擴展局部原型方法,常用來擴展選擇器之類,如$.fn.each()。在平時的應用中一般多會用jquery.fn.extend().



發佈了49 篇原創文章 · 獲贊 76 · 訪問量 22萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章