jQuery.extend(object) 扩展jQuery对象本身。用来在jQuery命名空间上增加新函数。
jQuery.fn.extend(object) 扩展 jQuery 元素集来提供新的方法(通常用来制作插件)

我们先把jQuery看成了一个类,这样好理解一些。

jQuery.extend(),是扩展的jQuery这个类。

假设我们把jQuery这个类看成是人类,能吃饭能喝水能跑能跳,现在我们用jQuery.extend这个方法给这个类拓展一个能唱歌的技能。这样的话,不论是男人,女人,xx人.....等能继承这个技能(方法)了。

jQuery.extend({
sing:function(){
alert("sing");
}
});
<!DOCTYPE html>
<html>
<head></head>
<script src="jquery.min.js"></script>
<script>
;(function($){
$.extend({
sing:function(){
alert("sing");
};
});
})(jQuery);
</script>
<script>
$(document).ready(function(){
$.sing();
});
</script>
</html>

这说明啥啊,这说明sing()变成了jQuery这个类本身的方法(object)嘛。他现在能”唱歌“了。

但是吧,这个能力啊,只有代表全人类的 jQuery 这个类本身,才能用啊。你个人想用,你张三李四王五麻六,你个小草民能代表全人类嘛?

所以啊,这个扩展也就是所谓的静态方法。只跟这个类本身有关。跟你具体的实例化对象是没关系滴。

我们再看看jQuery.fn.extend()这个方法。

从字面理解嘛,这个拓展的是jQuery.fn的方法。

jQuery.fn是啥玩意呢?

源码如下

jQuery.fn = jQuery.prototype = {
init:function(selector,context){
//code
}
};

哦,原来jQuery.fn=jQuery.prototype,就是原型啊。

那就一目了然了,jQuery.fn.extend拓展的是jQuery对象(原型的)的方法啊!

对象是啥?就是类的实例化嘛,例如,$("#abc")

这个玩意就是一个实例化的jQuery对象嘛。

那就是说,jQuery.fn.extend拓展的方法,你得用在jQuery对象上面才行啊!他得是张三李四王五痳六这些实例化的对象才能用啊。

说白了就是得这么用:假设xyz()是拓展的方法,$('selector').xyz();

你要是写成$.xyz();是会出错误滴。

代码如下

<!DOCTYPE html>
<html>
<head></head>
<script src="jquery.min.js"></script>
<script>
;(function($){
$.fn.extend({
sing:function(){
alert("sing");
};
});
})(jQuery);
</script>
<script>
$(document).ready(function(){
$("#test_div").sing();
});
</script>
<body>
<div id="test_div"></div>
</body>
</html>

其实吧,jQuery.extend()这个方法,主要是用来拓展个全局函数啦,例如$.ajax()这种,要不就是拓展个选择器啦,例如$.fn.each(),当选择器用。

大部分插件都是用jQuery.fn.extend()。

jQuery.extend(object)

为jQuery类添加类方法,可以理解为添加静态方法。如:

jQuery.extend({
min: function(a, b) { return a < b ? a : b; },
max: function(a, b) { return a > b ? a : b; }
});
jQuery.min(2,3); // 2
jQuery.max(4,5); //

Objectj jQuery.extend( target, object1, [objectN])

用一个或多个其他对象来扩展一个对象,返回被扩展的对象

var settings = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" }; //结果:settings被options修改,变成了{ validate: true, limit: 5, name: "bar" }
jQuery.extend(settings, options);

jQuery.fn.extend(object)

对jQuery.prototype进得扩展,就是为jQuery类添加“成员函数”。jQuery类的实例可以使用这个“成员函数”。

比如我们要开发一个插件,做一个特殊的编辑框,当它被点击时,便alert 当前编辑框里的内容。可以这么做:

$.fn.extend({
alertWhileClick:function() {
$(this).click(function(){
alert($(this).val());
});
}
});
$("#input1").alertWhileClick();

jQuery.extend() 的调用并不会把方法扩展到对象的实例上,引用它的方法也需要通过jQuery类来实现,如jQuery.init(),而 jQuery.fn.extend()的调用把方法扩展到了对象的prototype上,所以实例化一个jQuery对象的时候,它就具有了这些方法,这 是很重要的,在jQuery.js中到处体现这一点

jQuery.fn.extend = jQuery.prototype.extend

你可以拓展一个对象到jQuery的prototype里去,这样的话就是插件机制了。

(function($){
$.fn.tooltip = function( options ) {
//code
};
//等价于
var tooltip = {
function(options){
//code
}
};
$.fn.extend(tooltip) = $.prototype.extend(tooltip) = $.fn.tooltip
})( jQuery );

随机推荐

  1. 团队Alpha冲刺(四)

    目录 组员情况 组员1(组长):胡绪佩 组员2:胡青元 组员3:庄卉 组员4:家灿 组员5:凯琳 组员6:丹丹 组员7:何家伟 组员8:政演 组员9:鸿杰 组员10:刘一好 组员:何宇恒 展示组内最新 ...

  2. Dsyy的第一篇博文~

    2017-08-07  周一  晴热热热热热 咳咳,很多人看到dsyy第一反应是什么意思?当然是大神媛媛!显然不是些(diao)(si)yy.(da)(si)yy...的别义,咋有点此地无银三百两的感 ...

  3. psp 第二周

    11号                                                                              12号 类别c 内容c 开始时间s 结 ...

  4. 【final】140字互评②

    按照产品发布顺序 nice!----约吧 我们的团队展示相对于上次的手足无措,有了一定进步.但是整体还是不那么流畅总结起来的缺点是: 1.发布时,摄像头不清晰 且抖动 我们没有把摄像头固定,并且为了让 ...

  5. SQL入门之查询入门

    select语法一般结构: SELECT [ALL|DISTINCT] <目标列表达式> [别名] [, <目标列表达式> [别名]]... FROM <表名或视图名&g ...

  6. 【.Net】C# 将Access中时间段条件查询的数据添加到ListView中

    一.让ListView控件显示表头的方法 在窗体中添加ListView 空间,其属性中设置:View属性设置为:Detail,Columns集合中添加表头中的文字. 二.利用代码给ListView添加 ...

  7. document.readyState的使用

    document.readyState:判断文档是否加载完成.firefox不支持. 这个属性是只读的,传回值有以下的可能: 0-UNINITIALIZED:XML 对象被产生,但没有任何文件被加载. ...

  8. The Toll! Revisited UVA - 10537(变形。。)

    给定图G=(V,E)G=(V,E),VV中有两类点,一类点(AA类)在进入时要缴纳1的费用,另一类点(BB类)在进入时要缴纳当前携带金额的1/20(不足20的部分按20算) 已知起点为SS,终点为TT ...

  9. python中括号的使用

    1. 列表list是用[ ]包住的以逗号分隔的数据集合 所有对列表的解析均采用[ ],不论是元素引用或取值 [ ]表示空列表 2. 字典由键-值(key-value)对构成,一般可采用{ }表示 取字 ...

  10. [TJOI2013]单词 AC自动机

    题面: 洛谷 题解: 很久之前做的题了,只不过之前一直90....最近才发现是哪里写错了. 我们对字符集建AC自动机. 首先考虑一个暴力的做法,把文章当做一个长串,直接在自动机上跳,但是我们会发现,这 ...