jQuery为开发插件提拱了两个方法,分别是:

jQuery.fn.extend();

jQuery.extend();

(1)类级别 类级别你可以理解为拓展jquery类,最明显的例子是$.ajax(...),相当于静态方法

虽然 javascript 没有明确的类的概念,但是用类来理解它,会更方便。

jQuery便是一个封装得非常好的类,比如我们用 语句 $("#btn1") 会生成一个 jQuery类的实例。

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); // 5

ObjectjQuery.extend( target, object1, [objectN])用一个或多个其他对象来扩展一个对象,返回被扩展的对象

var settings = { validate: false, limit: 5, name: "foo" };

var options = { validate: true, name: "bar" };

jQuery.extend(settings, options);

结果:settings == { validate: true, limit: 5, name: "bar" }

(2)对象级别 对象级别则可以理解为基于对象的拓展,如$("#table").changeColor(...); 这里这个changeColor呢,就是基于对象的拓展了。 jQuery.fn.extend(object); 对jQuery.prototype进得扩展,就是为jQuery类添加“成员函数”。

jQuery类的实例可以使用这个“成员函数”。

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

$.fn.extend({

alertWhileClick:function() {

$(this).click(function(){

alert($(this).val());

});

}

});

$("#input1").alertWhileClick(); // 页面上为: $("#input1") 为一个jQuery实例,当它调用成员方法 alertWhileClick后,便实现了扩展,每次被点击时它会先弹出目前编辑里的内容。

(3)扩展

$.xy = {

add:function(a,b){return a+b;} ,

minus:function(a,b){return a-b;},

voidMethod:function(){ alert("void"); }

};

var i = $.xy.add(3,2);

var m = $.xy.minus(3,2);

$.xy.voidMethod();

jquery的$.extend和$.fn.extend作用及区别的更多相关文章

  1. jQuery中,$.extend,$obj.extend和$.fn.extend三者的区别

    jQuery中,$.extend,$obj.extend和$.fn.extend三者的区别 现在做的一个项目,所使用的框架是基于jQuery扩展的,于是平时学了一下jQuery,了解到了它的扩展函数: ...

  2. jQuery开发自定义插件 $.extend()与$.fn.extend()

    jQuery extend()和jQuery.fn.extend() jQuery提供两个用于封装扩展的方法: 1.$.extend(); 扩展jQuery类方法,即jQuery全局方法 (在全局可直 ...

  3. 理解jQuery的$.extend与$.fn.extend

    https://www.cnblogs.com/xuxiuyu/p/5989743.html 上面这篇博客总结的很棒!!,以下对自己的认识做一个总结 <!DOCTYPE html> < ...

  4. jQuery插件开发中$.extend和$.fn.extend辨析

    jQuery插件开发分为两种:   1 类级别 类级别你可以理解为拓展jquery类,最明显的例子是$.ajax(...),相当于静态方法. 开发扩展其方法时使用$.extend方法,即jQuery. ...

  5. $.fn与$.fx什么意思; $.extend与$.fn.extend用法区别; $(function(){})和(function(){})(jQuery)

    $.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效. 如扩展$.fn.abc() 那么你可以这样子:$("#div").abc(); 通常使 ...

  6. $.extend()和$.fn.extend()用法和区别

    $.extend()和$.fn.extend()用法和区别: 在自己制作插件的时候会经常用到$.extend()和$.fn.extend()两个函数,无论从外观还是作用都非常的类似,但是实际上它们的区 ...

  7. $.extend(),与$.fn.extend() 讲解

    $.extend(),与$.fn.extend() 讲解(一) (2013-07-11 10:24:31) 转载▼ 转自:http://blog.sina.com.cn/s/blog_a3bd3bd0 ...

  8. 插件的理解$.extend()与$.fn.extend()

    插件的理解.$.extend()与$.fn.extend()    插件开发包括两种:1.类级别的插件开发,即$.extend()扩展jquery对象本身:2.对象级别的插件开发,即$.fn.exte ...

  9. jquery的$.extend、$.fn.extend、 jQuery.extend( target, object1, [objectN])作用及区别

    jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(); jQuery.extend(); 虽然 javascript 没有明确的类的概念,但是用类来理解它,会更方便. ...

  10. jQuery - jQuery的$.extend和$.fn.extend作用及区别

    jQuery为开发插件提拱了两个方法,分别是: 1. jQuery.fn.extend(); 2. jQuery.extend(); 虽然 javascript没有明确的类的概念,但是可以构建类似类的 ...

随机推荐

  1. HDU 1109

    http://acm.hdu.edu.cn/showproblem.php?pid=1109 一个范围内给一堆点,求到这些点的最短距离最大 模拟退火,温度是步长 #include <iostre ...

  2. Java学习第五天

    一.内存分析 内存分析:指数据的存储,理解程序执行过程,运行期的行为,不是编译期. 分类 栈: 方法栈存储方法的局部变量|形参后进先出 堆: 对象堆存储new的对象散列存储 方法区: 特殊的堆,类方法 ...

  3. MINIX3 保护模式分析

    3.1 INTEL 保护模式概要 先要说明一个问题:不是 MINIX3 一定要设置这个保护模式,但是在 386 平台上, 引入了这个保护模式机制,MINIX3 不得不设立相关保护模式的内容.由于 38 ...

  4. Apache与Nginx服务器对比

      apache NginX 占用资源和内存 多 轻量级,同样起Web服务,占内存和资源更少   阻塞型 抗并发,异步非阻塞的,高并发下,可保持低资源低消耗低性能   可用的模块超多 可自定义模块,编 ...

  5. JavaScript个人学习记录总结(二)——验证表单输入之模式匹配

    该示例检查从文本窗口部件中获取姓名和电话号码这两个表单数据的有效性.当文本框中的值发生变化时,即引发一个change事件,从而可以调用一个函数来检查这两个输入值的格式是否正确. validator.h ...

  6. 计算2的N次方

    总时间限制:  1000ms 内存限制:  65536kB 描述 任意给定一个正整数N(N<=100),计算2的n次方的值. 输入 输入一个正整数N. 输出 输出2的N次方的值. 样例输入 5 ...

  7. Codeforces Round #372 (Div. 2)

    Codeforces Round #372 (Div. 2) C. Plus and Square Root 题意 一个游戏中,有一个数字\(x\),当前游戏等级为\(k\),有两种操作: '+'按钮 ...

  8. __attribute__你知多少(转)

    转自:http://www.cnblogs.com/astwish/p/3460618.html GNU C 的一大特色就是__attribute__ 机制.__attribute__ 可以设置函数属 ...

  9. Tensorflow 上手——手写数字识别

    下面代码是Tensorflow入门教程中的代码,实现了一个softmax分类器. 第4行是将data文件夹下的mnist数据压缩包读取为tf使用的minibatch字典. 第6-11行定义了所用的变量 ...

  10. int(M)与int

    int(M) ,加上zerofill后M才表现出有点效果,比如 int(3) zerofill,你插入到数据库里的是10,则实际插入为010,也就是在前面补充加了一个0.如果int(3)和int(10 ...