jq 插件 的两个相关的函数 jQuery.fn.extend(object); jQuery.extend(object);
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 的地方,使用这个方法了,
- $.add(3,4); //return 7
jQuery.fn.extend(object); 对jQuery.prototype进得扩展,就是为jQuery类添加“成员函数”。jQuery类的实例可以使用这个“成员函数”。
比如我们要开发一个插件,做一个特殊的编辑框,当它被点击时,便alert 当前编辑框里的内容。可以这么做:
- $.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);的更多相关文章
- jQuery为开发插件提拱了两个方法:jQuery.fn.extend(); jQuery.extend();
jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(); jQuery.extend(); jQuery.fn jQuery.fn = jQuery.prototype ...
- jquery插件的两种形式
这里总结一下jquery插件的两种形式,一种是通过字面量的形式组织代码,另一种是通过构造函数的方式.下面就两种形式来分析俩个例子. 例子1: ;(function ($,window,document ...
- jQ插件--时间线插件和拖拽API
这个时间轴是工作上用到的,自己写了一个, qq空间有时间轴的控件, 百度文库也有时间轴的控件: 百度的时间轴大概是这样的: 用户点击对应的锚链接, 那个三角会滚动, 然后左侧的界面也会滚动: 实际的 ...
- JQ插件
什么是插件 插件(plugin)是JQuery的扩展(Extension),以JQuery的核心代码为基础,是一种遵循一定规范的应用程序接口编写出来的程序. 插件的引入 引入jquery.js文件 引 ...
- Scala中Zip相关的函数
在Scala中存在好几个Zip相关的函数,比如zip,zipAll,zipped 以及zipWithIndex等等.我们在代码中也经常看到这样的函数,这篇文章主要介绍一下这些函数的区别以及使用. 1. ...
- JQ插件jquery.fn.extend与jquery.extend
jQuery为开发插件提拱了两个方法,分别是: JavaScript代码 jQuery.fn.extend(object); jQuery.extend(object); jQuery.extend( ...
- JQ插件ajaxFileUpload、php实现图片,数据同时上传
代码结构如下: 1.HTML代码,没必要解释了. <!DOCTYPE html> <html> <head> <meta charset="UTF- ...
- JQ插件之imgAreaSelect实现对图片的在线截图功能(java版)
前言:在做网站的时候经常用的功能就是,用户上传图片对自己上传的图片进行截图,DIV自己的头像.或者上传幻灯片大图进行DIV设置小图. 解决方案:目前我知道的解决方案有两个如下: 一.fla ...
- jq插件第二款来袭 图片滚动
这第二款也是非常实用的插件,也是与图片相关,关于图片的需求太多了,这个是图片滚动哦,不过不是无缝滚动,是左像右滚动,到头的话再往回滚动,利用scrollLeft实现的,支持自动滚动和每次滚动的个数默认 ...
- jQ插件编写
参考文档:http://www.cnblogs.com/Dlonghow/p/4142034.html 编写插件最先接触到的就是jQuery.fn.extend 和jQuery.extend 这个两个 ...
随机推荐
- 🎀idea-java序列化serialversionUID自动生成
简介 java.io.Serializable 是 Java 中的一个标记接口(marker interface),它没有任何方法或字段.当一个类实现了 Serializable 接口,那么这个类的对 ...
- .net core基础(一):安装并创建第一个webapi
一..net介绍 .net是一个开发者平台的统称,用它可以构建多种类型的应用程序. .net平台下的开发语言:C#,F#,Visual Basic .net平台标准:.NET Standard .ne ...
- Python爬取任意城市肯德基门店信息(json数据反序列化、提取数据、写入CSV)
本案关键内容点:json数据反序列化.提取数据.写入CSV 创建csv,写入表头数据,脚本同目录下会创建名称为book的csv文件,且第一行插入表头内容 import csv f = open('bo ...
- phpoffice php操作excel表格的导入和导出
https://packagist.org/packages/phpoffice/phpexcel 使用: composer require phpoffice/phpexcel 控制器引入 //引入 ...
- 在Python后端项目FastApi中使用MongoDB进行数据处理
我在前面随笔<在SqlSugar的开发框架中增加对低代码EAV模型(实体-属性-值)的WebAPI实现支持>中介绍了对于EAV数据存储的时候,我们把变化字段的数据记录存储在MongoDB数 ...
- CLion打开VS创建的GBK编码格式的项目中文乱码问题的解决方法
在 CLion 中设置 GBK 编码用于编译代码时,如果输出的 message 乱码,通常是由于控制台编码与代码文件的编码不匹配导致的.以下是解决问题的步骤: 1. 设置文件编码为 GBK 确保你的源 ...
- bat文件备份数据库
@echo off/*获取当前日期*/ set "Ymd=%date:~,4%%date:~5,2%%date:~8,2%" /*数据库自带的备份脚本的存放地址 --opt -u ...
- RISC-V指令:逻辑指令与移位指令
本节将继续学习逻辑指令(and.or.xor)和移位指令(sll.srl.sra) 逻辑指令 从CPU芯片电路角度来看,其实CPU更擅长指令逻辑操作,如与.或.异或 RISC-V指令集中包含了三种逻辑 ...
- 网络编程:UDP网路编程
参考:盛延敏:网络编程实战 一.UDP和TCP的不同 UDP 是一种"数据报"协议,而 TCP 是一种面向连接的"数据流"协议. TCP 是一个面向连接的协议, ...
- Redis介绍及6.2.x版本安装
概述 Redis官网:https://redis.io/ Redis 是完全开源免费的,遵守BSD协议,是一个高性能(NOSQL)的key-value数据库,Redis是一个开源的使用ANSI C语言 ...