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().