jQuery定义插件的方法
有些WEB开发者，会引用一个JQuery类库，然后在网页上写一写$("#")，$(".")，写了几年就对别人说非常熟悉JQuery。我曾经也是这样的人，直到有一次公司里的技术交流，我才改变了自己对自己的看法。
扩展jquery的时候。最核心的方法是以下两种：
$.extend(object)可以理解为jquery添加一个静态方法
$.fn.extend(object)可以理解为jquery实例添加一个方法
$.extend(object)
例子：
/*$.extend定义与调用
*****************************************/
$.extend({fun:function(){alert("执行方法一");}});//定义
$.fun();//调用
$.fn.extentd(object)
/*$.fn.extend定义与调用
*****************************************/
$.fn.extend({fun:function(){alert("执行方法");}});
$(this).fun();
//等同于
$.fn.fun=function(){alert("执行方法三");}
$(this).fun();
定义jquery插件的基本结构
1． 定义作用域：
为插件定义一个私有作用域。外界代码不能直接访问插件内部。插件内部代码不受外界干扰，也不会污染到全局变量。
//step定义JQuery的作用域
(function($){
})(jQuery);
2.为插件添加扩展方法：
//step01定义JQuery的作用域
(function($){
//step02插件的扩展方法名称
$.fn.easySlider=function(options){
}
})(jQuery);
3.设置默认值：
//step定义JQuery的作用域
(function($){
//step-a插件的默认值属性
vardefaults={
prevId:‘prevBtn‘,
prevText:‘Previous‘,
nextId:‘nextBtn‘,
nextText:‘Next‘
//……
};
//step插件的扩展方法名称
$.fn.easySlider=function(options){
//step-b合并用户自定义属性，默认属性
varoptions=$.extend(defaults,options);
}
})(jQuery);
其中：varoptions=$.extend(defaults,options)的含义了。表示options去覆盖了defaults的值，并把值赋给了options。
在插件环境中，就表示用户设置的值，覆盖了插件的默认值；如果用户没有设置默认值的属性，还是保留插件的默认值。
4.支持jquery选择器：
//step定义JQuery的作用域
(function($){
//step-a插件的默认值属性
vardefaults={
prevId:‘prevBtn‘,
prevText:‘Previous‘,
nextId:‘nextBtn‘,
nextText:‘Next‘
//……
};
//step插件的扩展方法名称
$.fn.easySlider=function(options){
//step-b合并用户自定义属性，默认属性
varoptions=$.extend(defaults,options);
//step支持JQuery选择器
this.each(function(){
});
}
})(jQuery);
5．支持JQuery的链接调用：
为了能达到链接调用的效果必须要把循环的每个元素return
//step定义JQuery的作用域
(function($){
//step-a插件的默认值属性
vardefaults={
prevId:‘prevBtn‘,
prevText:‘Previous‘,
nextId:‘nextBtn‘,
nextText:‘Next‘
//……
};
//step插件的扩展方法名称
$.fn.easySlider=function(options){
//step-b合并用户自定义属性，默认属性
varoptions=$.extend(defaults,options);
//step支持JQuery选择器
//step支持链式调用
returnthis.each(function(){
});
}
})(jQuery);
6.插件里的方法：
在插件里定义的方法，外界不能直接调用，我在插件里定义的方法也没有污染外界环境。
//step01定义JQuery的作用域
(function($){
//step03-a插件的默认值属性
vardefaults={
prevId:‘prevBtn‘,
prevText:‘Previous‘,
nextId:‘nextBtn‘,
nextText:‘Next‘
//……
};
//step06-a在插件里定义方法
varshowLink=function(obj){
$(obj).append(function(){return"("+$(obj).attr("href")+")"});
}
//step02插件的扩展方法名称
$.fn.easySlider=function(options){
//step03-b合并用户自定义属性，默认属性
varoptions=$.extend(defaults,options);
//step4支持JQuery选择器
//step5支持链式调用
returnthis.each(function(){
//step06-b在插件里定义方法
showLink(this);
});
}
})(jQuery);
通过以上内容给大家介绍了jQuery定义插件的方法，希望大家喜欢。