下文来自 http://www.itzhai.com/jquery-plug-ins-to-achieve-the-methods-and-principles-of-simple-instructions.html

jQuery插件实现的方法和原理简单说明

jQuery是一个封装的很好的类,比如我们使用$("#username")会生成一个 jQuery类的实例。

1、jQuery插件开发主要使用如下两个方法:
1.1、添加静态方法
jQuery.extend(object);

为扩展jQuery类本身,为类添加新的方法,可以理解文添加静态方法。

$.extend({
  addMethod : function(a, b){return a + b;} // $.addMethod(1, 2); //return 3
});
1.2、添加成员方法
jQuery.fn.extend(object);
jQuery.fn = jQuery.prototype

给jQuery对象添加方法,对jQuery.prototype进行扩展,为jQuery类添加成员方法:

$.fn.extend({
getInputText:function(){
$(this).click(function(){
alert($(this).val());
});
}
}); $("#username").getInputText();
2、一个通用的框架:

以下是一个通用的框架:

(function($){
$.fn.yourPluginName = function(options){
//各种属性和参数 var options = $.extend(defaults, options); this.each(function(){
//插件的实现代码 });
};
})(jQuery);

关于

$.extend(defaults, options);

就是通过合并defaults和options来扩展defaults,实现插件默认参数的功能,详细解释可以参考jQuery的官方文档:

http://api.jquery.com/jQuery.extend/

jQuery插件实现的方法和原理简单说明的更多相关文章

  1. jQuery插件扩展extend的实现原理

    相信每位前端的小伙伴对jQuery都不陌生吧,它最大的魅力之一就是有大量的插件,去帮助我们更轻松的实现各种功能. 前几天晚上,闲来无事,就自己动手写了个简单的jQuery插件,功能很简单,只是让选定的 ...

  2. jQuery 插件封装的方法

    方式1.$.fn.xxx ==>针对元素添加方法: ;(function ($) { $.fn.m​​yPlugin = function () { //你自己的插件代码 }; })(jQuer ...

  3. jquery插件jTemplates使用方法

    简单记一下我所做项目中用到的代码,以备以后用的时候一看明确了. 1.jsp(jquery-jtemplates.js下载地址:http://download.csdn.net/detail/xlb74 ...

  4. 50个jQuery插件可将你的网站带到另一个高度

    Web领域一直在发生变化并且其边界在过去的每一天都在发生变化(甚至不能以小时为计),随着其边界的扩展取得了许多新发展.在这些进步之中,开发者的不断工作创造了更大和更好的脚本,这些脚本以插件方式带来更好 ...

  5. 推荐60个jQuery插件(转)

    jQuery插件jQuery Spin Button自定义文本框数值自增或自减 jQuery插件JQuery Pager分页器实现javascript分页功能 jQuery插件FontSizer实现J ...

  6. Wordpress解析系列之PHP编写hook钩子原理简单实例

    Wordpress作为全球应用最广泛的个人博客建站工具,有很多的技术架构值得我们学习推敲.其中,最著名最经典的编码技术架构就是采用了hook的机制. hook翻译成中文是钩子的意思,单独看这个词我们难 ...

  7. 简易jQuery插件

    之前写过jQuery插件的笔记 如何用jQuery封装插件 我一直觉得前面讲了一大堆闭包和三种插件封装模式有点冗余,那篇笔记我直到记录到后面才发现这事情很简单,想来想去还是觉得网上的一些文章把事情搞复 ...

  8. 如何创建一个自定义jQuery插件

    简介 jQuery 库是专为加快 JavaScript 开发速度而设计的.通过简化编写 JavaScript 的方式,减少代码量.使用 jQuery 库时,您可能会发现您经常为一些常用函数重写相同的代 ...

  9. 如何开发jQuery插件

    一:普及JQuery知识 知识1:用JQuery写插件时,最核心的方法有如下两个: $.extend(object) 可以理解为,为JQuery 类添加一个静态方法. $.fn.extend(obje ...

随机推荐

  1. 有indexPath获取到cell对象

    //SHSecretaryTipsCell *cell=(SHSecretaryTipsCell *)[tableView cellForRowAtIndexPath:indexPath];

  2. docker镜像与容器概念

    本文用图文并茂的方式介绍了容器.镜像的区别和Docker每个命令后面的技术细节,能够很好的帮助读者深入理解Docker. 这篇文章希望能够帮助读者深入理解Docker的命令,还有容器(containe ...

  3. doclint in jdk8

    http://blog.joda.org/2014/02/turning-off-doclint-in-jdk-8-javadoc.html Turning off doclint in JDK 8 ...

  4. java regex possissive relunctant

    Java正则表达中Greedy Reluctant Possessive 的区别 分类: java 2015-01-16 00:28 1588人阅读 评论(9) 收藏 举报 正则表达式Java 目录( ...

  5. TextureView+SurfaceTexture+OpenGL ES来播放视频(二)

    引自:http://www.jianshu.com/p/b2d949ab1a1a 在使用OpenGL ES 绘制前,我先概括下接下来要做的工作:我先借用一个博主kiffa举的的一个栗子,我觉得说的恰到 ...

  6. Hibernate 系列教程4-单向多对一

    项目图片 hibernate.cfg.xml <mapping resource="com/jege/hibernate/one/way/manytoone/User.hbm.xml& ...

  7. HDU 1155 Bungee Jumping 物理

    题目大意:给出k:绳子的劲度系数,l:绳长,s:桥高,w:邦德的质量,g取9.81.绳子弹力=形变量*劲度系数.如果落地速度大于10 则摔死,小于0则飘着空中. 题目思路:根据能量守恒得知:落地的动能 ...

  8. preg_replace 方法

    标红关键字 $text = "Sample sentence from KomunitasWeb, regex has become popular in web programming. ...

  9. HDU 1072/BFS

    题目链接 Nightmare Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Tota ...

  10. 【语法】修饰符 static extern const

    转载自:http://my.oschina.net/u/2560887/blog/552683 一.C语言中的static的作用 在C语言中,static的字面意思很容易把我们导入歧途,其实它的作用有 ...