jQuery插件实现的方法和原理简单说明
jQuery插件实现的方法和原理简单说明
jQuery是一个封装的很好的类,比如我们使用$("#username")会生成一个 jQuery类的实例。
jQuery.extend(object);
为扩展jQuery类本身,为类添加新的方法,可以理解文添加静态方法。
$.extend({
addMethod : function(a, b){return a + b;} // $.addMethod(1, 2); //return 3
});
jQuery.fn.extend(object);
jQuery.fn = jQuery.prototype
给jQuery对象添加方法,对jQuery.prototype进行扩展,为jQuery类添加成员方法:
$.fn.extend({
getInputText:function(){
$(this).click(function(){
alert($(this).val());
});
}
});
$("#username").getInputText();
以下是一个通用的框架:
(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插件实现的方法和原理简单说明的更多相关文章
- jQuery插件扩展extend的实现原理
相信每位前端的小伙伴对jQuery都不陌生吧,它最大的魅力之一就是有大量的插件,去帮助我们更轻松的实现各种功能. 前几天晚上,闲来无事,就自己动手写了个简单的jQuery插件,功能很简单,只是让选定的 ...
- jQuery 插件封装的方法
方式1.$.fn.xxx ==>针对元素添加方法: ;(function ($) { $.fn.myPlugin = function () { //你自己的插件代码 }; })(jQuer ...
- jquery插件jTemplates使用方法
简单记一下我所做项目中用到的代码,以备以后用的时候一看明确了. 1.jsp(jquery-jtemplates.js下载地址:http://download.csdn.net/detail/xlb74 ...
- 50个jQuery插件可将你的网站带到另一个高度
Web领域一直在发生变化并且其边界在过去的每一天都在发生变化(甚至不能以小时为计),随着其边界的扩展取得了许多新发展.在这些进步之中,开发者的不断工作创造了更大和更好的脚本,这些脚本以插件方式带来更好 ...
- 推荐60个jQuery插件(转)
jQuery插件jQuery Spin Button自定义文本框数值自增或自减 jQuery插件JQuery Pager分页器实现javascript分页功能 jQuery插件FontSizer实现J ...
- Wordpress解析系列之PHP编写hook钩子原理简单实例
Wordpress作为全球应用最广泛的个人博客建站工具,有很多的技术架构值得我们学习推敲.其中,最著名最经典的编码技术架构就是采用了hook的机制. hook翻译成中文是钩子的意思,单独看这个词我们难 ...
- 简易jQuery插件
之前写过jQuery插件的笔记 如何用jQuery封装插件 我一直觉得前面讲了一大堆闭包和三种插件封装模式有点冗余,那篇笔记我直到记录到后面才发现这事情很简单,想来想去还是觉得网上的一些文章把事情搞复 ...
- 如何创建一个自定义jQuery插件
简介 jQuery 库是专为加快 JavaScript 开发速度而设计的.通过简化编写 JavaScript 的方式,减少代码量.使用 jQuery 库时,您可能会发现您经常为一些常用函数重写相同的代 ...
- 如何开发jQuery插件
一:普及JQuery知识 知识1:用JQuery写插件时,最核心的方法有如下两个: $.extend(object) 可以理解为,为JQuery 类添加一个静态方法. $.fn.extend(obje ...
随机推荐
- Linux网卡配置与绑定
一定要在服务管理中关闭NetworkManager服务并禁用自动启动. 第一步:先查看下本机网卡,使用命令到network-scripts 下 [root@root~]# cd /etc/syscon ...
- beagleboneblack HDMI不能显示
beagleboneblack 接上HDMI到电视上,没有显示画面 看了资料之后才知道 http://elinux.org/Beagleboard:BeagleBoneBlack_HDMI#Conn ...
- Jquery 实现原理之 Ajax
一:Jquery Ajax底层接口有:$.ajaxPrefilters.$.ajaxTransport.$.ajaxSettings.$ajaxSetup.$ajaxSettings; 其中$.aja ...
- php+redis实现电商秒杀功能
这一次总结和分享用Redis实现分布式锁来完成电商的秒杀功能.先扯点个人观点,之前我看了一篇博文说博客园的文章大部分都是分享代码,博文里强调说分享思路比分享代码更重要(貌似大概是这个意思,若有误请谅解 ...
- 使用btoa和atob来进行Base64转码和解码
btoa: 将普通字符串转为Base64字符串 atob: 将Base64字符串转为普通字符串 说明:window.btoa不支持汉字: ===>使用window.encodeURI ...
- Batch Sort
Batch Sort time limit per test 2 seconds memory limit per test 256 megabytes input standard input ou ...
- linux ubuntu平台下安装Scrapy
1.安装Python sudo apt-get install python2.7 python2.7-dev 2.安装pip 下载get-pip.py 选中该文件所在路径,执行下面的命令 sudo ...
- spark中groupByKey与reducByKey
[译]避免使用GroupByKey Scala Spark 技术 by:leotse 原文:Avoid GroupByKey 译文 让我们来看两个wordcount的例子,一个使用了reduceB ...
- 转:全面剖析C#正则表达式
到目前为止,许多的编程语言和工具都包含对正则表达式的支持,当然.NET也不例外,.NET基础类库中包含有一个名称空间和一系列可以充分发挥规则表达式威力的类. 正则表达式的知识可能是不少 ...
- 转:Selenium2.0 click()不生效的解决办法
除了http://573301735.com/?p=5126讲的,昨天又发现一个让我1个小时生不如死的问题,就是使用两个不同的配置文件来初始化driver,findelement方法获取到的坐标居然不 ...