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

jQuery.fn.extend(object);

jQuery.extend(object);

jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法。

jQuery.fn.extend(object);给jQuery对象添加方法。

fn 是什么东西呢。查看jQuery代码,就不难发现。

jQuery.fn = jQuery.prototype = {

   init: function( selector, context ) {//.... 

   //......

};

原来 jQuery.fn = jQuery.prototype.对prototype肯定不会陌生啦。

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

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

jQuery.extend(object); 为jQuery类添加添加类方法,可以理解为添加静态方法。如:

$.extend({

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

});

便为 jQuery 添加一个为 add 的 “静态方法”,之后便可以在引入 jQuery 的地方,使用这个方法了,

$.add(3,4);  //return 7

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

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

  1. $.fn.extend({
  2. alertWhileClick:function(){
  3. $(this).click(function(){
  4. alert($(this).val());
  5. });
  6. }
  7. });
  8. $("#input1").alertWhileClick(); //页面上为:<input id="input1" type="text"/>

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

真实的开发过程中,当然不会做这么小白的插件,事实上jQuery提拱了丰富的操作文档,事件,CSS ,Ajax、效果的方法,结合这些方法,便可以开发出更加 Niubility 的插件。

转载自这里

[转载]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() 讲解(一) (2013-07-11 10:24:31) 转载▼ 转自:http://blog.sina.com.cn/s/blog_a3bd3bd0 ...

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

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

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

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

  9. jquery的$.extend和$.fn.extend作用及区别/用span实现进度条/腾讯云IIS端口号修改

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

随机推荐

  1. Android切换页面--setContentView

    setContentView 一般切换页面,通过Intent,startActivity可以实现,但系统创建Activity是非常耗时的,如果对切换画面时间有要求,只能用setContentView在 ...

  2. .NET性能优化方面的总结

    从2004年底开始接触C#到现在也有2年多的时间了,因为有C++方面的基础,对于C#,我习惯于与C++对比.现在总结一些.NET方面的性能优化方面的经验,算是对这两年多的.NET工作经历的总结.    ...

  3. QVW中实现日期区间的选择功能!

    QV在日期的选择上不是很灵活,日期区段的选择可以在列表框中直接用鼠标拖拉区段,如果跨周期比较长了还是不是很方便啦. 下面介绍的方式是完全实现了起始日期的选择功能. 注:日期这个字段在抽取的时候一定要格 ...

  4. iOS设备、Icon、LaunchImage、图片分辨率

    iOS设备 iOS设备的屏幕的大小.分辨率以及比例因数(Scale Factor)[1]. iPhone 设备 宽(inch) 高(inch) 对角线(inch) 逻辑分辨率(point) Scale ...

  5. HDU 1114 Piggy-Bank(完全背包)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1114 题目大意:根据储钱罐的重量,求出里面钱最少有多少.给定储钱罐的初始重量,装硬币后重量,和每个对应 ...

  6. Window 下安装Redis

    下载地址:https://github.com/dmajkic/redis/downloads. 下载到的Redis支持32bit和64bit.根据自己实际情况选择,将64bit的内容cp到自定义盘符 ...

  7. oracle系列索引

    今天终于把oracle入门的知识通篇过了一遍. 一篇文章没有写,先做个索引.把知识系统的梳理下. 数据库基本概念-oracle介绍 oracle安装,配置,启动 oracle工具 sqlplus 用户 ...

  8. php生成图片验证码

    验证码主要用来防止暴力破解的方式来进行登录,下面是php中的图片验证码生成方式,废话不多说,直接上代码 /** * 生成验证码 */ function buildRandomString($type= ...

  9. iOS: AFNetworking手动配置(iOS7.1, AF2.2.4)

    一.下载AFNetworking. 二.将AFNetworking-master下的AFNetworking目录拖入到项目中 三.为项目添加Linking to a Library or Framew ...

  10. 如何通过友盟分析发布后App崩溃日志-b

    要分析崩溃日志,首先需要保留发布时的编译出来的.xcarchive文件.这个文件包含了.DSYM文件. 我一般的做法是,发布成功后,把这个文件.xcarchive直接提交到代码版本库对应的版本分支里, ...