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万+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章