jQuery插件开发基础知识:类级别和对象级别插件编写
需积分: 0 137 浏览量
更新于2024-08-31
收藏 113KB PDF 举报
jQuery弹簧插件编写基础之“又见弹窗”
本文将对jQuery弹簧插件编写基础之“又见弹窗”进行详细的知识点总结,涵盖jQuery插件开发的基础知识、插件开发的两种方式、接收配置参数等方面的内容。
**jQuery插件开发的基础知识**
jQuery插件开发主要分为两类:类级别和对象级别。类级别,即在jQuery类本身上扩展方法,类似与$.ajax,$.get等。对象级别,这里所谓的对象是指通过jQuery选择器选中的jQuery对象,在该对象上添加方法。例如:$('div').css(), $('div').show()等。在实际开发中,我们通常选用对象级别的方法来开发插件,jQuery强大的选择器及对象操作是我们选择这种方式很大的一个原因。
**类级别的插件开发**
在类级别的插件开发中,我们可以使用$.extend()方法来扩展jQuery类上的方法。例如:
```
$.extend({
foo: function(){
//
},
bar: function(){
//
}
})
```
在这里,对扩展方法的命名需要考究一些,以免与jQuery类中的原有方法重名。即便如此,当我们需要在类上扩展多个方法时仍有可能会出现命名冲突的情况,为此我们可以创建自定义的命名空间:
```
$.myPlugin={
foo: function(){
//
},
bar: function(){
//
}
}
```
这样,我们可以避免命名冲突,并且可以更好地组织我们的插件代码。
**对象级别的插件开发**
在对象级别的插件开发中,我们可以使用$.fn对象来扩展jQuery对象上的方法。例如:
```
$.fn.foo = function(){
//doSomething
}
```
这样,我们可以在选择器选中的对象上调用foo方法,例如:
```
$('#obj').foo();
```
**jQuery.fn的原理**
在对象级别的插件开发中,我们经常使用$.fn对象来扩展jQuery对象上的方法,但你知道$.fn是什么东东吗?其实,$.fn是jQuery.prototype的别名,查看jQuery源码我们可以发现:
```
jQuery.fn = jQuery.prototype = {
init: function(selector, context){
//.
}
}
```
**接收配置参数**
在编写一个插件时,我们可以让使用插件的人能按自己的意愿设置插件的一些属性,这就需要插件有接收参数的功能,同时当使用插件的人不传入参数时,插件内部也有一套自己默认的配置参数。例如:
```
$.fn.foo = function(options){
var defaults = {
color: '#000',
backgroundColor: 'red'
}
}
```
这样,我们可以在使用插件时传入自定义的参数,也可以使用插件内部的默认配置参数。
2017-06-28 上传
2009-04-19 上传
2023-05-20 上传
2023-06-01 上传
2023-09-18 上传
2023-11-23 上传
2023-05-18 上传
2023-05-09 上传
2024-01-01 上传
weixin_38686231
- 粉丝: 10
- 资源: 917
最新资源
- C++标准程序库:权威指南
- Java解惑:奇数判断误区与改进方法
- C++编程必读:20种设计模式详解与实战
- LM3S8962微控制器数据手册
- 51单片机C语言实战教程:从入门到精通
- Spring3.0权威指南:JavaEE6实战
- Win32多线程程序设计详解
- Lucene2.9.1开发全攻略:从环境配置到索引创建
- 内存虚拟硬盘技术:提升电脑速度的秘密武器
- Java操作数据库:保存与显示图片到数据库及页面
- ISO14001:2004环境管理体系要求详解
- ShopExV4.8二次开发详解
- 企业形象与产品推广一站式网站建设技术方案揭秘
- Shopex二次开发:触发器与控制器重定向技术详解
- FPGA开发实战指南:创新设计与进阶技巧
- ShopExV4.8二次开发入门:解决升级问题与功能扩展