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 AJAX 调用WebService实现代码
Mar 24 Javascript
JSON 和 JavaScript eval使用说明
Jun 13 Javascript
jquery实现图片滚动效果的简单实例
Nov 23 Javascript
js和jquery中循环的退出和继续下一个循环
Sep 03 Javascript
JavaScript实现将xml转换成html table表格的方法
Apr 17 Javascript
JavaScript实现简单的日历效果
Sep 25 Javascript
微信小程序 ecshop地址三级联动实现实例代码
Feb 28 Javascript
Vue 滚动行为的具体使用方法
Sep 13 Javascript
JS文件中加载jquery.js的实例代码
May 05 jQuery
webpack 代码分离优化快速指北
May 18 Javascript
vue回到顶部监听滚动事件详解
Aug 02 Javascript
jQuery实现放大镜案例
Oct 19 jQuery
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通过header发送自定义数据方法
2018/01/18 PHP
PHP中用Trait封装单例模式的实现
2019/12/18 PHP
jquery 框架使用教程 AJAX篇
2009/10/11 Javascript
jQuery实现高亮显示的方法
2015/03/10 Javascript
JS实现Fisheye效果动感放大菜单代码
2015/10/21 Javascript
JS转换HTML转义符的方法
2016/08/24 Javascript
JS日程管理插件FullCalendar中文说明文档
2017/02/06 Javascript
javascript作用域链与执行环境详解
2017/03/25 Javascript
JavaScript函数定义方法实例详解
2019/03/05 Javascript
浅谈javascript中的prototype和__proto__的理解
2019/04/07 Javascript
浅谈JS中this在各个场景下的指向
2019/08/14 Javascript
[04:00]DOTA2解说界神雕侠侣 CJ第四天谷子现场过生日
2013/07/30 DOTA
[05:26]2014DOTA2西雅图国际邀请赛 iG战队巡礼
2014/07/07 DOTA
[03:46]DAC趣味视频-中文考试.mp4
2017/04/02 DOTA
详解Python程序与服务器连接的WSGI接口
2015/04/29 Python
Python GUI编程完整示例
2019/04/04 Python
5款Python程序员高频使用开发工具推荐
2019/04/10 Python
对python 中class与变量的使用方法详解
2019/06/26 Python
Python BeautifulSoup [解决方法] TypeError: list indices must be integers or slices, not str
2019/08/07 Python
python实现根据文件格式分类
2019/10/31 Python
在Python中使用MySQL--PyMySQL的基本使用方法
2019/11/19 Python
基于virtualenv创建python虚拟环境过程图解
2020/03/30 Python
浅谈python多线程和多线程变量共享问题介绍
2020/04/17 Python
Python3.7将普通图片(png)转换为SVG图片格式(网站logo图标)动起来
2020/04/21 Python
Python实现计算图像RGB均值方式
2020/06/04 Python
详解python百行有效代码实现汉诺塔小游戏(简约版)
2020/10/30 Python
css3 边框、背景、文本效果的实现代码
2018/03/21 HTML / CSS
出纳员的岗位职责
2014/02/22 职场文书
班班通校本培训方案
2014/03/12 职场文书
婚内分居协议书范文
2014/11/26 职场文书
幼儿园大班个人总结
2015/02/28 职场文书
2015年银行柜员工作总结报告
2015/04/01 职场文书
怎样写家长意见
2015/06/04 职场文书
区域销售大会开幕词
2016/03/04 职场文书
解决jupyter notebook图片显示模糊和保存清晰图片的操作
2021/04/24 Python
详解CSS中postion和opacity及cursor的特性
2022/08/14 HTML / CSS