jQuery为开发插件提拱了两个方法,分别是:  http://www.cnblogs.com/wyjgreat/archive/2011/07/19/2110754.html

jq.fn 的实现 是可以  链式调用的

jq.extend  的实现  是可以   $.xxx 调用的

JavaScript代码

  • jQuery.fn.extend(object);
  • jQuery.extend(object);

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

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

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

JavaScript代码

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

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

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

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

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

XML/HTML代码

  • $.extend({
  •   add:function(a,b){return a+b;}
  • });

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

JavaScript代码
  • $.add(3,4); //return 7

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

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

JavaScript代码
  • $.fn.extend({
  • alertWhileClick:function(){
  • $(this).click(function(){
  • alert($(this).val());
  • });
  • }
  • });
  • $(“#input1″).alertWhileClick(); //页面上为:<input id=”input1″ type=”text”/>

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

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

注意:

在这里还有一个特殊的地方,就是在函数开头的地方有jQuery.extend = jQuery.fn.extend,而在程序的前面已经将jQuery.prototype赋值给jQuery.fn了,所以在后面的调用中会出现 jQuery.extend()和jQuery.fn.extend()的不同调用,这两个方法调用产生的结果也不一样,jQuery.extend() 的调用并不会把方法扩展到对象的实例上,引用它的方法也需要通过jQuery类来实现,如jQuery.init(),而 jQuery.fn.extend()的调用把方法扩展到了对象的prototype上,所以实例化一个jQuery对象的时候,它就具有了这些方法,这 是很重要的,在jQuery.js中到处体现这一点

jq 插件 的两个相关的函数 jQuery.fn.extend(object); jQuery.extend(object);的更多相关文章

  1. jQuery为开发插件提拱了两个方法:jQuery.fn.extend(); jQuery.extend();

    jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(); jQuery.extend(); jQuery.fn jQuery.fn = jQuery.prototype ...

  2. jquery插件的两种形式

    这里总结一下jquery插件的两种形式,一种是通过字面量的形式组织代码,另一种是通过构造函数的方式.下面就两种形式来分析俩个例子. 例子1: ;(function ($,window,document ...

  3. jQ插件--时间线插件和拖拽API

    这个时间轴是工作上用到的,自己写了一个, qq空间有时间轴的控件, 百度文库也有时间轴的控件: 百度的时间轴大概是这样的: 用户点击对应的锚链接,  那个三角会滚动, 然后左侧的界面也会滚动: 实际的 ...

  4. JQ插件

    什么是插件 插件(plugin)是JQuery的扩展(Extension),以JQuery的核心代码为基础,是一种遵循一定规范的应用程序接口编写出来的程序. 插件的引入 引入jquery.js文件 引 ...

  5. Scala中Zip相关的函数

    在Scala中存在好几个Zip相关的函数,比如zip,zipAll,zipped 以及zipWithIndex等等.我们在代码中也经常看到这样的函数,这篇文章主要介绍一下这些函数的区别以及使用. 1. ...

  6. JQ插件jquery.fn.extend与jquery.extend

    jQuery为开发插件提拱了两个方法,分别是: JavaScript代码 jQuery.fn.extend(object); jQuery.extend(object); jQuery.extend( ...

  7. JQ插件ajaxFileUpload、php实现图片,数据同时上传

    代码结构如下: 1.HTML代码,没必要解释了. <!DOCTYPE html> <html> <head> <meta charset="UTF- ...

  8. JQ插件之imgAreaSelect实现对图片的在线截图功能(java版)

    前言:在做网站的时候经常用的功能就是,用户上传图片对自己上传的图片进行截图,DIV自己的头像.或者上传幻灯片大图进行DIV设置小图. 解决方案:目前我知道的解决方案有两个如下:       一.fla ...

  9. jq插件第二款来袭 图片滚动

    这第二款也是非常实用的插件,也是与图片相关,关于图片的需求太多了,这个是图片滚动哦,不过不是无缝滚动,是左像右滚动,到头的话再往回滚动,利用scrollLeft实现的,支持自动滚动和每次滚动的个数默认 ...

  10. jQ插件编写

    参考文档:http://www.cnblogs.com/Dlonghow/p/4142034.html 编写插件最先接触到的就是jQuery.fn.extend 和jQuery.extend 这个两个 ...

随机推荐

  1. 🎀idea-java序列化serialversionUID自动生成

    简介 java.io.Serializable 是 Java 中的一个标记接口(marker interface),它没有任何方法或字段.当一个类实现了 Serializable 接口,那么这个类的对 ...

  2. .net core基础(一):安装并创建第一个webapi

    一..net介绍 .net是一个开发者平台的统称,用它可以构建多种类型的应用程序. .net平台下的开发语言:C#,F#,Visual Basic .net平台标准:.NET Standard .ne ...

  3. Python爬取任意城市肯德基门店信息(json数据反序列化、提取数据、写入CSV)

    本案关键内容点:json数据反序列化.提取数据.写入CSV 创建csv,写入表头数据,脚本同目录下会创建名称为book的csv文件,且第一行插入表头内容 import csv f = open('bo ...

  4. phpoffice php操作excel表格的导入和导出

    https://packagist.org/packages/phpoffice/phpexcel 使用: composer require phpoffice/phpexcel 控制器引入 //引入 ...

  5. 在Python后端项目FastApi中使用MongoDB进行数据处理

    我在前面随笔<在SqlSugar的开发框架中增加对低代码EAV模型(实体-属性-值)的WebAPI实现支持>中介绍了对于EAV数据存储的时候,我们把变化字段的数据记录存储在MongoDB数 ...

  6. CLion打开VS创建的GBK编码格式的项目中文乱码问题的解决方法

    在 CLion 中设置 GBK 编码用于编译代码时,如果输出的 message 乱码,通常是由于控制台编码与代码文件的编码不匹配导致的.以下是解决问题的步骤: 1. 设置文件编码为 GBK 确保你的源 ...

  7. bat文件备份数据库

    @echo off/*获取当前日期*/ set "Ymd=%date:~,4%%date:~5,2%%date:~8,2%" /*数据库自带的备份脚本的存放地址 --opt -u ...

  8. RISC-V指令:逻辑指令与移位指令

    本节将继续学习逻辑指令(and.or.xor)和移位指令(sll.srl.sra) 逻辑指令 从CPU芯片电路角度来看,其实CPU更擅长指令逻辑操作,如与.或.异或 RISC-V指令集中包含了三种逻辑 ...

  9. 网络编程:UDP网路编程

    参考:盛延敏:网络编程实战 一.UDP和TCP的不同 UDP 是一种"数据报"协议,而 TCP 是一种面向连接的"数据流"协议. TCP 是一个面向连接的协议, ...

  10. Redis介绍及6.2.x版本安装

    概述 Redis官网:https://redis.io/ Redis 是完全开源免费的,遵守BSD协议,是一个高性能(NOSQL)的key-value数据库,Redis是一个开源的使用ANSI C语言 ...