第一种方法:

在很多基于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插件编写规范的更多相关文章

  1. jQuery插件编写及链式编程模型小结

    JQuery极大的提高了我们编写JavaScript的效率,让我们可以愉快的编写代码,做出各种特效.大多数情况下,我们都是使用别人开发的JQuery插件,今天我们就来看看如何把我们常用的功能做出JQu ...

  2. jQuery插件编写及链式编程模型

    jQuery插件编写及链式编程模型小结 JQuery极大的提高了我们编写JavaScript的效率,让我们可以愉快的编写代码,做出各种特效.大多数情况下,我们都是使用别人开发的JQuery插件,今天我 ...

  3. jQuery插件编写,

    jQuery插件编写 jQuery插件 最近搞jquery插件的编写这里做下笔记 给jquery扩展的方式很多,看的我眼花缭乱 方式1 $.fun=function(){} 方式2 $.fn.fun= ...

  4. jQuery插件编写步骤详解

    如今做web开发,jquery 几乎是必不可少的,就连vs神器在2010版本开始将Jquery 及ui 内置web项目里了.至于使用jquery好处这里就不再赘述了,用过的都知道.今天我们来讨论下jq ...

  5. jquery插件编写【转载】

    如今做web开发,jquery 几乎是必不可少的,就连vs神器在2010版本开始将Jquery 及ui 内置web项目里了.至于使用jquery好处这里就不再赘述了,用过的都知道.今天我们来讨论下jq ...

  6. (转)jQuery插件编写学习+实例——无限滚动

    原文地址:http://www.cnblogs.com/nuller/p/3411627.html 最近自己在搞一个网站,需要用到无限滚动分页,想想工作两年有余了,竟然都没有写过插件,实在惭愧,于是简 ...

  7. jQuery插件编写学习+实例——无限滚动

    最近自己在搞一个网站,需要用到无限滚动分页,想想工作两年有余了,竟然都没有写过插件,实在惭愧,于是简单学习了下jQuery的插件编写,然后分享出来. 先说下基础知识,基本上分为两种,一种是对象级别的插 ...

  8. jQuery插件编写学习中遇见的问题--attr prop

    个人博客: https://chenjiahao.xyz 最近在学习jQuery的插件的编写,有两种方式,$.fn.extend以及$.extend,一种是作用于对象原型上,一种是直接作用于jQuer ...

  9. jquery插件编写模版

    jquery插件是什么??这里以讨论实力方法为主,比如 $("div").pluginname({}); 他的最简单形势应该是 $.prototype.plugin = funct ...

随机推荐

  1. dispatch_set_target_queue 说明

    参照:http://blog.csdn.net/growinggiant/article/details/41077221 http://codingobjc.com/blog/2013/05/07/ ...

  2. 线程Thread,有参数和参数

    一.不带参数的 using System; using System.Collections.Generic; using System.Text; using System.Threading; n ...

  3. 关于NGINX的502的装逼打怪之路

    写日志之前先copy一段nginx502的原因,从某网看到如下,然而这并不是重点,最重要还是看博主手敲的东西. 一.NGINX 502错误排查 NGINX 502 Bad Gateway错误是Fast ...

  4. boost相关

    1 boost 常用函数 <1> tcp跟udp的收发函数名 tcp收发 async_write async_read async_read_until udp收发 async_send_ ...

  5. JavaScript的学习1

    1.什么是JavaScript? JavaScirpt 它是由网景公司开发的一款基本浏览器.基于面向对象.事件驱动式的网页脚本语言!它的主要应用场景是表单验证.网页特效.一些简单的网页游戏.与服务器进 ...

  6. Programming in Lua读书笔记

         Lua的长处之一就是可以通过新类型和函数来扩展其功能.动态类型检查最大限度允许多态出现,并自动简化调用内存管理的接口,因为这样不需要关心谁来分配内存谁来释放内存,也不必担心数据溢出.高级函数 ...

  7. windows下CMake使用图文手册 Part 2

    例子2:有目录的项目 我现在有个文件夹ProjectDate,有如下文件结构 E:. │  CMakeLists.txt │ ├─include │      Date.h │ └─src       ...

  8. verilog断言(SVA:systemverlog assertion)语法 ---- 转载

    转载自:http://blog.sina.com.cn/s/blog_4c270c730101f6mw.html 作者:白栎旸     断言assertion被放在verilog设计中,方便在仿真时查 ...

  9. shell 中调用其他的脚本

    方法有三种: 1 使用source 2 使用 . 3 使用sh 简单实验: first.sh #!/bin/bashecho 'your are in first file' second.sh #! ...

  10. 数据回复之TestDisk的使用

    1,选择[No Log]或者是[Create]进入 2.选择好要恢复的硬盘,回车 3.选择Intel或者其他的系统,大多数选择intel(windows)使用,回车确认 4.选择[Analyse](分 ...