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 相关文章推荐
jQuery中文入门指南,翻译加实例,jQuery的起点教程
Feb 09 Javascript
js随机生成网页背景颜色的方法
Feb 26 Javascript
解决bootstrap中modal遇到Esc键无法关闭页面
Mar 09 Javascript
JS组件Bootstrap按钮组与下拉按钮详解
May 10 Javascript
jQuery实现的简单拖拽功能示例
Sep 13 Javascript
jQuery包裹节点用法完整示例
Sep 13 Javascript
浅谈js的ajax的异步和同步请求的问题
Oct 07 Javascript
JS返回只包含数字类型的数组实例分析
Dec 16 Javascript
vue判断input输入内容全是空格的方法
Mar 02 Javascript
使用nvm和nrm优化node.js工作流的方法
Jan 17 Javascript
Vue Router history模式的配置方法及其原理
May 30 Javascript
在layui中select更改后生效的方法
Sep 05 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
在Windows中安装Apache2和PHP4的权威指南
2006/10/09 PHP
php下使用curl模拟用户登陆的代码
2010/09/10 PHP
基于php导出到Excel或CSV的详解(附utf8、gbk 编码转换)
2013/06/25 PHP
php读取csv文件后,uft8 bom导致在页面上显示出现问题的解决方法
2013/08/10 PHP
PHP生成指定长度随机数最简洁的方法
2014/07/14 PHP
PHP实现163邮箱自动发送邮件
2016/03/29 PHP
PHP实现自动识别原编码并对字符串进行编码转换的方法
2016/07/13 PHP
Thinkphp5框架ajax接口实现方法分析
2019/08/28 PHP
javascript 原型继承介绍
2011/08/30 Javascript
JavaScript 判断浏览器是否支持SVG的代码
2013/03/21 Javascript
zTree插件之单选下拉菜单实例代码
2013/11/07 Javascript
js 用CreateElement动态创建标签示例
2013/11/20 Javascript
angular.element方法汇总
2015/01/07 Javascript
jQuery设置指定网页元素宽度和高度的方法
2015/03/25 Javascript
Bootstrap每天必学之级联下拉菜单
2016/03/27 Javascript
原生js仿jquery一些常用方法(必看篇)
2016/09/20 Javascript
thinkphp标签实现bootsrtap轮播carousel实例代码
2017/02/19 Javascript
深入理解JavaScript继承的多种方式和优缺点
2017/05/12 Javascript
node.js实现微信开发之获取用户授权
2019/03/18 Javascript
Vue将页面导出为图片或者PDF
2020/08/17 Javascript
vue实现购物车结算功能
2020/06/18 Javascript
前端性能优化建议
2020/09/17 Javascript
python&MongoDB爬取图书馆借阅记录
2016/02/05 Python
Python遍历目录中的所有文件的方法
2016/07/08 Python
python遍历序列enumerate函数浅析
2017/10/17 Python
python中实现字符串翻转的方法
2018/07/11 Python
Python list运算操作代码实例解析
2020/01/20 Python
卸载tensorflow-cpu重装tensorflow-gpu操作
2020/06/23 Python
Python趣味实例,实现一个简单的抽奖刮刮卡
2020/07/18 Python
ANINE BING官方网站:奢华的衣橱基本款和时尚永恒的单品
2019/11/26 全球购物
年终考核实施方案
2014/05/26 职场文书
银行柜员与客户起冲突检讨书
2014/09/27 职场文书
优秀班主任主要事迹材料
2014/12/16 职场文书
学雷锋献爱心活动总结
2015/05/11 职场文书
mybatis中sql语句CDATA标签的用法说明
2021/06/30 Java/Android
不负正版帝国之名 《重返帝国》引领SLG手游制作新的标杆
2022/04/07 其他游戏