制作高质量的制作高质量的JQuery Plugin 插件的方法插件的方法
JQuery Plugin插件，如果大家不明白什么是JQuery插件或都不清楚如何编写可以查看其官方的网站：jQuery Authoring
Guidelines
好了，下面有一些我觉得想做一个好的插件必须应有的要求：
1、在JQuery命名空间下声明只声明一个单独的名称
2、接受options参数，以便控制插件的行为
3、暴露插件的默认设置 ，以便外面可以访问
4、适当地将子函数提供给外部访问调用
5、保持私有函数
6、支持元数据插件
下面将逐条地过一遍：
只声明一个单独的名称只声明一个单独的名称
这表明是一个单独的插件脚本。如果你的脚本包含多个插件或者是互补的插件（像$.fn.doSomething()和
$.undoSomething()），那么你可以根据要求声明多个名称。但一般情况下，力争用单一的名称来维持插件现实的所有细节。
在本例中，我们将声明一个叫“hilight”的名称
代码如下:
// 插件的定义
$.fn.hilight = function( options ){
// 这里就是插件的实现代码了…
};
然后我们可以像这样调用它：
$(“divTest”).hilight();
接受一个接受一个options参数，以便控件插件的行为参数，以便控件插件的行为
代码如下:
$.fn.hilight = function(options){
var defaults = {
foreground : ‘red’,
background : ‘yellow’
};
//Extends out defaults options with those privided 扩展我们默认的设置
$.extend(defaults,options);
};
而我们可以这样使用它：
代码如下:
$(‘#myDiv’).hilight({
foreground: ‘blue’
});
暴露插件的默认设置暴露插件的默认设置 ，以便外面可以访问，以便外面可以访问
作为插件的提升和优化，我们应该将上面的代码暴露出来作为插件的默认设置。
这非常重要，这样做让使用插件的用户可以非常容易地用最少的代码重写或自定义该插件。然而这个我们可以借助JavaScript
function对象的优势：
代码如下:
$.fn.hilight = function(options){
//Extend our default options with those provided
//Note that the first arg to extend is an empty object
//this is to keep from overriding our “defaults” object
var opts = $.extend({},$.fn.hilight.defaults,options);
}
$.fn.hilight.defaults = {
foreground : ‘red’,
background : ‘yellow’
};
这里值得注意的是$.extend()第一个参数是一个空的对象，这样可以让我们重写插件的默认设置
用户可以像这样使用插件：
代码如下:
// override plugin default foreground color
$.fn.hilight.defaults.foreground = ‘blue’;
// …
// invoke plugin using new defaults
$(‘.hilightDiv’).hilight();
// …
// override default by passing options to plugin method
资源评论
weixin_38703980
- 粉丝: 6
- 资源: 878
最新资源
- lottery-data.xlsx
- 111111111111111111
- ethercat_doc.zh-CN_纯中文.pdf
- MNIST手写数字数据集图片版4.2w张0-9个数字.7z
- mongoDB的windows系统的备份及恢复的python脚本
- 基于PaddleSpeech的语音识别项目（已做好接口）
- 【Android Studio】实验四 Android常用界面控件（一）
- 审查数据test审查数据test审查数据test审查数据test
- ethercat_driver_ros2-main.zip
- 基于X86-64+ARM64架构CPU使用docker-compose一键离线部署mongodb 7.0.14容器版副本集群工具
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
