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

时间:2022-09-15 17:08:07

下文来自 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. git版本管理策略及相关技巧(A)

    公司几乎所有的项目都是使用 git 仓库来管理代码,以前对 git 只有些肤浅的了解,每次提交代码或者上线的时候总是会提心吊胆,生怕出现一些未知的问题.经过三个月的踩坑和填坑, git 操作颇显成熟. ...

  2. Sql Server 孤立用户解决办法

    Sql Server 孤立用户 是我们经常遇到的事情,今天详细的梳理了下,希望能帮到你 当把用户数据库从一台 Sql Server 使用备份和恢复的方式迁移到另一台服务器.数据库恢复以后,原先用户定义 ...

  3. vimrc for windows

    set nobackupsource $VIMRUNTIME/vimrc_example.vimsource $VIMRUNTIME/mswin.vimbehave mswin:color deser ...

  4. jquery实现替代iframe的功能

    使用iframe能很好的嵌入其他的网页或者网站,但是iframe每次加载都会浪费好多的时间,且会阻止其他元素的加载,搜索引擎也不能识别页面ifram框架中被调用的链接.文本.图片等等内容的. Html ...

  5. 最简单的视音频播放演示样例8:DirectSound播放PCM

    ===================================================== 最简单的视音频播放演示样例系列文章列表: 最简单的视音频播放演示样例1:总述 最简单的视音频 ...

  6. SaaS的那些事儿

    前两年...   大一大二期间,不知道软件架构.云服务器.数据库为何物,偶尔听过却从未用过.天天学的写的东西都是一些命令行代码,所幸在学完<数据结构>和<算法导论>后能够独立实 ...

  7. table中的一些另类标签

    thead/tbody/tfoot/caption/colgroup 注意:thead/tbody/tfoot三部分内容不受编辑顺序影响只和标签本身含义从头到脚显示不能把两个tbody的内容进行合并单 ...

  8. C&num; 跨进程 设置窗口owner

    窗口间跨进程通信 1. 发送方 public const int WM_InsertChart_Completed = 0x00AA; //查找窗口 [DllImport("User32.d ...

  9. PAT 1116 Come on&excl; Let&&num;39&semi;s C

    1116 Come on! Let's C (20 分)   "Let's C" is a popular and fun programming contest hosted b ...

  10. 【dfs】LETTERS

    1212:LETTERS [题目描述] 给出一个roe×colroe×col的大写字母矩阵,一开始的位置为左上角,你可以向上下左右四个方向移动,并且不能移向曾经经过的字母.问最多可以经过几个字母. [ ...