【原】jQuery编写插件
分享一下编写设置和获取颜色的插件，首先我将插件的名字命名为jquery.color.js。该插件用来实现以下两个功能1.设置元素的颜色。2.获取元素的颜色。
先在搭建好如下编写插件的框架：
;(function($){
//这里编写插件代码
})(jQuery);
我这里采用jQuery.fn.extend().这种方法来编写，代码如下：
;(function($){
$.fn.extend({
"color":function(value){
//这里写插件代码
}
});
})(jQuery);
这个方法可里面有一个value.参数，当给color().这个传入了参数那么就用来设置color.值，不传参数就是获取color().值。代码如下：
;(function($){
$.fn.extend({
"color":function(value){
if(value==undefined){
return this.css('color');
}
else{
return this.css('color',value);
}
}
});
})(jQuery);
最后我们来测试一下：
<body>
<script>
$(function(){
alert($('#div1').color());
$('#div2').color('#333');
});
</script>
<div id="div1" style="color:blue">blue</div>
<div id="div2" style="color:#ccc">#ccc</div>
</body>
测试结果如下图:
OK!测试没问题，全部完成。做这篇分享只是为了分享一下如何实现编写插件的整个过程
【原】jQuery编写插件的更多相关文章
- jquery编写插件
jquery编写插件的方法 版权声明:作者原创,转载请注明出处! 编写插件的两种方式: 1.类级别开发插件(1%) 2.对象级别开发(99%) 类级别的静态开发就是给jquery添加静态方法,三 ...
- javascript&&jquery编写插件模板
javascrpt插件编写模板 这里不分享如何编写插件,只留一个框架模板,使用面向对象的形式进行编写,方便管理 ;(function(window,document){ function FnName ...
- jquery编写插件的方法
版权声明:作者原创,转载请注明出处! 编写插件的两种方式: 1.类级别开发插件(1%) 2.对象级别开发(99%) 类级别的静态开发就是给jquery添加静态方法,三种方式 1.添加新的全局函数 2 ...
- 再谈：jquery编写插件的方法
版权声明:作者原创,转载请注明出处! 编写插件的两种方式: 1.类级别开发插件(1%) 2.对象级别开发(99%) 类级别的静态开发就是给jquery添加静态方法,三种方式 1.添加新的全局函数 2. ...
- 两个jquery编写插件实例
(1) 封装基于jq弹窗插件 相信码友们对于$.fn.extexd();$.extend()以及$.fn.custom和$.custom都有一定的了解:我阐述一下我自己对于$.fn.custom和 ...
- jquery编写插件（转）
教你开发jQuery插件(转) 阅读目录 基本方法 支持链式调用 让插件接收参数 面向对象的插件开发 关于命名空间 关于变量定义及命名 压缩的好处 工具 GitHub Service Hook 原 ...
- jQuery编写插件--封装全局函数的插件（一些常用的js验证表达式）
上一篇写到了jQuery插件的3种类型,介绍了第一种类型的写法--封装jQuery对象的方法插件.这一篇要介绍第二种插件类型:封装全局函数的插件:这类插件就是在jQuery命名空间内部添加函数:这类插 ...
- jquery 编写插件入门
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <sc ...
- 用jquery编写的分页插件
用jquery编写的分页插件 源码 function _pager_go(total_page) { var page_str = $("#_pager_textbox").val ...
随机推荐
- RHCA442学习笔记-Unit10内存地址及分配
Unit 10 Memory Addressing and Allocation 内存地址及分配 学习目标: A. 虚拟地址与物理地 B. 调整内存地址分配 C. 解析内存溢出 10.1 O ...
- linux调度器 信息解读
http://blog.csdn.net/wudongxu/article/category/791519
- android和javascript之间相互通信实例分析
1. AndroidManifest.xml中必须使用许可 "android.permission.INTERNET", 否则会出Web page not available错误 ...
- (转+整理) oracle authid definer 与 authid current_user
转:http://blog.csdn.net/indexman/article/details/17067531 http://blog.csdn.net/liqfyiyi/article/detai ...
- VS2010常用插件介绍之Javascript插件（一）
引自:http://blog.csdn.net/cyxlzzs/article/details/6583577 今天在写JS时,写到500多行时,感觉代码已经很难看了.想到C#代码都有折叠功能,是不是 ...
- 如何创建windows xp 虚拟机
如何创建windows xp 虚拟机 一．所需软件 1. VMware-workstation-full-12.0.0-2985596 赠送vm12 激活key一枚: 5A02H-AU243 ...
- 安卓百度地图开发so文件引用失败问题研究
博客: 安卓之家 微博: 追风917 CSDN: 蒋朋的家 简书: 追风917 博客园: 追风917 # 问题 首先,下面的问题基本都是在Android Studio下使用不当导致,eclipse是百 ...
- NSArray 常用的一些方法
- (NSUInteger) count; 返回数组中元素个数 - (id)objectAtIndex:(NSUInteger)index; 返回一个id类型的数组指定位置元素 - (id)lastO ...
- javascript 中caller,callee,call,apply 的概念[转载]
在提到上述的概念之前,首先想说说javascript中函数的隐含参数:arguments Arguments : 该对象代表正在执行的函数和调用它的函数的参数. [function.]argument ...
- java之sleep、wait、yield、join、notify乱解
① 这两个方法来自不同的类分别是,sleep来自Thread类,和wait来自Object类. sleep是Thread的静态类方法,谁调用的谁去睡觉,即使在a线程里调用b的sleep方法,实际上还是 ...