jQuery插件开发模式
jQuery插件一般有三种开发方式：
- 通过$.extend来扩展jQuery
- 通过$.fn 向jQuery添加新的方法
- $.widget()应用jQuery UI的部件工厂方式创建
第一种$.extend()相对简单，一般很少能够独立开发复杂插件，第三种是一种高级开发模式，本文不做介绍。第二种则是一般插件开发用到的方式，本文着重讲述。
插件开发
第二种插件开发方式一般是如下定义
$.fn.pluginName=function(){
// your code here
};
插件开发一般用面向对象思维
例如定义一个对象
var Test=function(ele,opt){
this.ele=ele,
this.defaults={
'color':'red',
'fontSize':'12px',
'textDecoration':'none'
},
this.options=$.extend({},this.defaults,opt);
};
//定义方法
Test.prototype={
changeCss: function(){
return this.ele.css({
'color':this.options.color,
'fontSize':this.options.fontSize,
'textDecoration':this.options.textDecoration
});
}
};
$.extend({},this.defaults,opt)有{}主要是为了创建一个新对象，保留对象的默认值。
$.fn.myPlugin=function(options){
// 创建test实体
var test=new Test(this,options);
return test.changeCss();
};
调用插件
$(function(){
$('a').myPlugin({
'color':'blue',
'fontSize':'20px'
});
});
上述开发方法的问题
上述的开发存在一个严重的问题，就是定义了一个全局的Test，这样对于插件的兼容等方面都不好。万一别的地方用到Test，那就天啦撸。所有我们要把代码包起来，用自调用匿名函数（块级作用域或者私有作用域）包裹，就不会出现这个问题了；包裹方法如下
;(function($,window,document,undefined){
// code
})(jQuery,window,document);
