jQuery插件开发的两种方法及$.fn.extend的详解


Posted in Javascript onJanuary 16, 2014

jQuery插件开发分为两种:

1 类级别

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

开发扩展其方法时使用$.extend方法,即jQuery.extend(object);

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

页面中调用:
var i = $.add(3,2); 
var j = $.minus(3,2);

2 对象级别

对象级别则可以理解为基于对象的拓展,如$("#table").changeColor(...); 这里这个changeColor呢,就是基于对象的拓展了。

开发扩展其方法时使用$.fn.extend方法,即jQuery.fn.extend(object);

$.fn.extend({ check:function(){ 
return this.each({ 
this.checked=true; 
}); 
}, 
uncheck:function(){ 
return this.each({ 
this.checked=false; 
}); 
} 
});

页面中调用:
$('input[type=checkbox]').check(); 
$('input[type=checkbox]').uncheck();

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();
Javascript 相关文章推荐
工作中常用到的JS表单验证代码(包括例子)
Nov 11 Javascript
jQuery ready函数滥用分析
Feb 16 Javascript
jQuery中的.bind()、.live()和.delegate()之间区别分析
Jun 08 Javascript
上传的js验证(图片/文件的扩展名)
Apr 25 Javascript
可以用鼠标拖动的DIV实现思路及代码
Oct 21 Javascript
jQuery 中DOM 操作详解
Jan 13 Javascript
jquery用ajax方式从后台获取json数据后如何将内容填充到下拉列表
Aug 26 Javascript
Js操作DOM元素及获取浏览器高宽的简单方法
Sep 08 Javascript
12个非常有用的JavaScript技巧
May 17 Javascript
微信小程序媒体组件详解(视频,音乐,图片)
Sep 19 Javascript
修改vue+webpack run build的路径方法
Sep 01 Javascript
Electron 打包问题:electron-builder 下载各种依赖出错(推荐)
Jul 09 Javascript
js查找某元素中的所有图片地址的方法
Jan 16 #Javascript
jQuery - css() 方法示例详解
Jan 16 #Javascript
jquery预览图片实现鼠标放上去显示实际大小
Jan 16 #Javascript
jquery对元素拖动排序示例
Jan 16 #Javascript
jsPDF生成pdf后在网页展示实例
Jan 16 #Javascript
在firefox和Chrome下关闭浏览器窗口无效的解决方法
Jan 16 #Javascript
js获取某元素的class里面的css属性值代码
Jan 16 #Javascript
You might like
PHP 5.0 Pear安装方法
2006/12/06 PHP
PHP中执行MYSQL事务解决数据写入不完整等情况
2014/01/07 PHP
php缓冲输出实例分析
2015/01/05 PHP
php抽象方法和普通方法的区别点总结
2019/10/13 PHP
json 实例详细说明教程
2009/10/31 Javascript
javascript中直接引用Microsoft的COM生成Word
2014/01/20 Javascript
javascript 回到顶部效果的实现代码
2014/02/17 Javascript
jQuery取得设置清空select选择的文本与值
2014/07/08 Javascript
深入理解JavaScript系列(47):对象创建模式(上篇)
2015/03/04 Javascript
Jquery 垂直多级手风琴菜单附源码下载
2015/11/17 Javascript
EasyUI布局 高度自适应
2016/06/04 Javascript
JS模拟bootstrap下拉菜单效果实例
2016/06/17 Javascript
通过JS获取Request.QueryString()参数的值实现方法
2016/09/27 Javascript
JavaScript解析JSON格式数据的方法示例
2017/01/24 Javascript
利用angularjs1.4制作的简易滑动门效果
2017/02/28 Javascript
NodeJs模拟登陆正方教务
2017/04/28 NodeJs
jquery拖动改变div大小
2017/07/04 jQuery
React Native中的RefreshContorl下拉刷新使用
2017/10/09 Javascript
js实现每日签到功能
2018/11/29 Javascript
基于JS+HTML实现弹窗提示是否确认提交功能
2020/06/17 Javascript
如何基于jQuery实现五角星评分
2020/09/02 jQuery
python分割和拼接字符串
2013/11/01 Python
Python操作sqlite3快速、安全插入数据(防注入)的实例
2014/04/26 Python
python通过定义一个类实例作为ftp回调方法
2015/05/04 Python
详解Django框架中的视图级缓存
2015/07/23 Python
Python断言assert的用法代码解析
2018/02/03 Python
TensorFlow高效读取数据的方法示例
2018/02/06 Python
python移位运算的实现
2019/07/15 Python
详解Python爬虫爬取博客园问题列表所有的问题
2021/01/18 Python
软件缺陷的分类都有哪些
2014/08/22 面试题
AJAX应用和传统Web应用有什么不同
2013/08/24 面试题
应用电子专业学生的自我评价
2013/10/16 职场文书
中医专业应届生求职信
2013/11/17 职场文书
教师个人师德工作总结2015
2015/05/12 职场文书
《田忌赛马》教学反思
2016/02/19 职场文书
Java面试题冲刺第十七天--基础篇3
2021/08/07 面试题