jQuery插件编写规范
第一种方法:
在很多基于jQuery或基于Zepto的插件中,在立即函数执行前面会加上";"这个符号。
这是为了防止前面的其他插件没有正常关闭。
在立即执行函数执行时,会一般会传入jQuery,window等。举个例子:
;(function($,window,undefined){
//.....
})(jQuery,window)
window传递进来作为局部变量存在,而非全局变量,这样可以加快解析流程,以及影响最小化。
undefined没有传进来,以便可以确保此undefined是真正的undefined。因为ECMAScript3里的undefined是可以修改的,ECMAScript5不可以修改。
下面是自定义jQuery插件的规范:
;(function($,window,undefined){
var pluginName = "chaojidan",
defaults = {
name:"dandan"
};
function Plugin(element, options){
this.element = element;
this.options = $.extend( {} , defaults,options );
this._name = pluginName;
this._defaults = defaults;
this.init();
}
Plugin.prototype.init = function(){
//初始化插件
};
$.fn[pluginName] = function(options){ //真正的插件包装,防止出现多个实例
return this.each(function(){
if(!$.data(this,"plugin_"+pluginName)){
$.data(this,"plugin_"+pluginName, new Plugin(this, options));
}
});
}
})(jQuery,window)
调用此插件:
$("#elem").chaojidan({name:"xiaoxiao"});
第二种方法:
;(function($,window,undefined){
var myObject = {
init : function(options, elem){
this.options = $.extend({}, this.options, options);
this.elem = elem;
this.$elem = $(elem);
this._build();
return this;
},
options:{
name:"dandan"
},
_build:function(){
},
myMethod:function(){
}
};
if(typeof Object.create != "function"){
Object.create = function(o){
function F(){}
F.prototype = o;
return new F();
}
}
$.plugin = function(name, object){
$.fn[name] = function(options){
return this.each(function(){
if(!$.data(this,name)){
$.data(this,name,Object.create(object).init(options,this))
}
});
}
}
$.plugin("chaojidan",myObject);
})(jQuery,window);
调用方式:
$("#elem").chaojidan({name:"xiaoxiao"});
对于上面的两种方法,我们定义插件时,都传递了带有默认值的对象字面量给$.extend()。然而,如果我们想自定义此默认值的对象字面量,也就是说,用户可以重写此默认对象字面量,那么我们该如何来写呢?
其实非常简单,我们只要把此默认对象字面量这样赋值就行了。
$.fn.pluginName.options = {
name:"dandan"
}
这样,用户能够重写全局默认配置,达到插件构造的灵活性。
加油!
jQuery插件编写规范的更多相关文章
- jQuery插件编写及链式编程模型小结
JQuery极大的提高了我们编写JavaScript的效率,让我们可以愉快的编写代码,做出各种特效.大多数情况下,我们都是使用别人开发的JQuery插件,今天我们就来看看如何把我们常用的功能做出JQu ...
- jQuery插件编写及链式编程模型
jQuery插件编写及链式编程模型小结 JQuery极大的提高了我们编写JavaScript的效率,让我们可以愉快的编写代码,做出各种特效.大多数情况下,我们都是使用别人开发的JQuery插件,今天我 ...
- jQuery插件编写,
jQuery插件编写 jQuery插件 最近搞jquery插件的编写这里做下笔记 给jquery扩展的方式很多,看的我眼花缭乱 方式1 $.fun=function(){} 方式2 $.fn.fun= ...
- jQuery插件编写步骤详解
如今做web开发,jquery 几乎是必不可少的,就连vs神器在2010版本开始将Jquery 及ui 内置web项目里了.至于使用jquery好处这里就不再赘述了,用过的都知道.今天我们来讨论下jq ...
- jquery插件编写【转载】
如今做web开发,jquery 几乎是必不可少的,就连vs神器在2010版本开始将Jquery 及ui 内置web项目里了.至于使用jquery好处这里就不再赘述了,用过的都知道.今天我们来讨论下jq ...
- (转)jQuery插件编写学习+实例——无限滚动
原文地址:http://www.cnblogs.com/nuller/p/3411627.html 最近自己在搞一个网站,需要用到无限滚动分页,想想工作两年有余了,竟然都没有写过插件,实在惭愧,于是简 ...
- jQuery插件编写学习+实例——无限滚动
最近自己在搞一个网站,需要用到无限滚动分页,想想工作两年有余了,竟然都没有写过插件,实在惭愧,于是简单学习了下jQuery的插件编写,然后分享出来. 先说下基础知识,基本上分为两种,一种是对象级别的插 ...
- jQuery插件编写学习中遇见的问题--attr prop
个人博客: https://chenjiahao.xyz 最近在学习jQuery的插件的编写,有两种方式,$.fn.extend以及$.extend,一种是作用于对象原型上,一种是直接作用于jQuer ...
- jquery插件编写模版
jquery插件是什么??这里以讨论实力方法为主,比如 $("div").pluginname({}); 他的最简单形势应该是 $.prototype.plugin = funct ...
随机推荐
- 51nod 1180 方格射击游戏
M*N的方格矩阵,一个人在左下角格子的中心,除他所站位置外,其他格子的中心都有一个敌人,他一次可发射一枚子弹干掉一条直线上的所有敌人,问至少要发射多少子弹才能干掉所有敌人. Input 输入2个数m, ...
- linux下搭建sock5代理
VPN大家耳熟能详,但是socks用到的人比较少,那什么是socks呢?请看第二段或者百度百科,socks分别有4和5两个版本,现在5为主流.工作中经常用VPN访问国外,但是同时国内的速度又慢了,让人 ...
- SQL查询一个月第一天/最后一天及日期格式化
1.一个月第一天的Select DATEADD(mm, DATEDIFF(mm,0,getdate()), 0) 2.本周的星期一Select DATEADD(wk, DATEDIFF(wk,0,ge ...
- System.Drawing.Color
System.Drawing.Color color=Color.Red; System.Drawing.Color color=Color.FromArgb(,,); System.Drawing. ...
- iOS收到Push后播放声音和震动
一.APNS 1.注册 [cpp] [[UIApplication sharedApplication] registerForRemoteNotificationTypes:UIRemoteNoti ...
- .NET MEF入门级例子
学习新东西,喜欢从简单的例子入手,感觉理解和上手会快点,本文记录下我做的一个简单的mef的例子,至于理论的话百度,谷歌多的去了. Mef可以在你调整了某些功能的时候不需要重新去做代码,只需要换掉相应的 ...
- hibernate配置文件hibernate.cfg.xml的详细解释
<!--标准的XML文件的起始行,version='1.0'表明XML的版本,encoding='gb2312'表明XML文件的编码方式--> <?x ...
- peer not authenticated error
问题背景 系统:OS X El Capitan,10.11.2 IDE:Android Studio 2.0 Preview Java:1.8.0_65 Gradle:2.3 clone了代码后,在i ...
- Doxygen给C程序生成注释文档
近段时间,一直在学习华为C语言编程规范(2011版),在“注释”这一章中发现了一种“Doxygen”的注释转文档工具,查看诸多相关资料,并进行编程实践,终于可以利用Doxygen给C程序生成注释文档. ...
- MySQL Workbench “Error Code: 1175” 的解决方法
转自:http://www.linuxidc.com/Linux/2012-04/59333.htm 当用MySQL Workbench进行数据库的批量更新时,执行一个语句会碰到以下错误提示: Err ...