jquery的extend和fn.extend的使用说明


Posted in Javascript onJanuary 09, 2011

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 当前编辑框里的内容。可以这么做:

$.fn.extend({ 
alertWhileClick:function(){ 
$(this).click(function(){ 
alert($(this).val()); 
}); 
} 
}); 
$("#input1").alertWhileClick(); //页面上为:<input id="input1" type="text"/>
Javascript 相关文章推荐
JS 实现完美include载入实现代码
Aug 05 Javascript
简单实用的反馈表单无刷新提交带验证
Nov 15 Javascript
完美实现仿QQ空间评论回复特效
May 06 Javascript
JavaScript操作HTML DOM节点的基础教程
Mar 11 Javascript
微信小程序 后台https域名绑定和免费的https证书申请详解
Nov 10 Javascript
BootStrap表单宽度设置方法
Mar 10 Javascript
vue脚手架搭建过程图解
Jun 06 Javascript
通过实例讲解JS如何防抖动
Jun 15 Javascript
刷新页面后让控制台的js代码继续执行
Sep 20 Javascript
微信小程序 导入图标实现过程详解
Oct 11 Javascript
Bootstrap简单实用的表单验证插件BootstrapValidator用法实例详解
Mar 29 Javascript
vue自定义标签和单页面多路由的实现代码
May 03 Javascript
js对象之JS入门之Array对象操作小结
Jan 09 #Javascript
理解JavaScript中的对象 推荐
Jan 09 #Javascript
最佳JS代码编写的14条技巧
Jan 09 #Javascript
JavaScript定义类或函数的几种方式小结
Jan 09 #Javascript
javascript中用星号表示预录入内容的实现代码
Jan 08 #Javascript
js中访问html中iframe的文档对象的代码[IE6,IE7,IE8,FF]
Jan 08 #Javascript
js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版
Jan 08 #Javascript
You might like
PHP校验ISBN码的函数代码
2011/01/17 PHP
PHP中创建空文件的代码[file_put_contents vs touch]
2012/01/20 PHP
json的键名为数字时的调用方式(示例代码)
2013/11/15 PHP
php中filter函数验证、过滤用户输入的数据
2014/01/13 PHP
yii框架builder、update、delete使用方法
2014/04/30 PHP
PHP实现的DES加密解密封装类完整实例
2017/04/29 PHP
tp5(thinkPHP5)框架连接数据库的方法示例
2018/12/24 PHP
详谈commonjs模块与es6模块的区别
2017/10/18 Javascript
Vue.js划分组件的方法
2017/10/29 Javascript
使用vue实现grid-layout功能实例代码
2018/01/05 Javascript
浅谈Vue下使用百度地图的简易方法
2018/03/23 Javascript
微信小程序学习笔记之本地数据缓存功能详解
2019/03/29 Javascript
TensorFlow.js 微信小程序插件开始支持模型缓存的方法
2020/02/21 Javascript
Python使用PIL模块生成随机验证码
2017/11/21 Python
Jupyter notebook远程访问服务器的方法
2018/05/24 Python
python ---lambda匿名函数介绍
2019/03/13 Python
Python为何不能用可变对象作为默认参数的值
2019/07/01 Python
python中upper是做什么用的
2020/07/20 Python
Python Http请求json解析库用法解析
2020/11/28 Python
Pycharm创建python文件自动添加日期作者等信息(步骤详解)
2021/02/03 Python
CSS3 translate导致字体模糊的实例代码
2019/08/30 HTML / CSS
Ticketmaster德国票务网站:购买音乐会和体育等门票
2016/11/14 全球购物
英国领先的维生素和补充剂品牌:Higher Nature
2019/08/26 全球购物
学生处主任岗位职责
2013/12/01 职场文书
计算机专业毕业生求职信分享
2013/12/24 职场文书
高等教育学自荐书范文
2014/02/10 职场文书
早会主持词
2014/03/17 职场文书
元宵节晚会主持人串词
2014/03/25 职场文书
大学生党员批评与自我批评范文
2014/10/14 职场文书
2014年人事行政工作总结
2014/12/03 职场文书
工程部经理岗位职责
2015/02/02 职场文书
大明湖导游词
2015/02/03 职场文书
家庭贫困证明
2015/06/16 职场文书
2016新党章学习心得体会
2016/01/15 职场文书
检讨书怎么写?
2019/06/21 职场文书
【D4DJ】美少女DJ企划 动画将于明年冬季开播第2季
2022/04/11 日漫