分享一下编写设置和获取颜色的插件，首先我将插件的名字命名为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编写插件的更多相关文章
	

    
						
  1. jquery编写插件
		
    jquery编写插件的方法    版权声明:作者原创,转载请注明出处! 编写插件的两种方式: 1.类级别开发插件(1%) 2.对象级别开发(99%) 类级别的静态开发就是给jquery添加静态方法,三 ...
    
		
    2. 
						
  2. javascript&&jquery编写插件模板
		
    javascrpt插件编写模板 这里不分享如何编写插件,只留一个框架模板,使用面向对象的形式进行编写,方便管理 ;(function(window,document){ function FnName ...
    
		
    3. 
								
  3. jquery编写插件的方法
		
     版权声明:作者原创,转载请注明出处! 编写插件的两种方式: 1.类级别开发插件(1%) 2.对象级别开发(99%) 类级别的静态开发就是给jquery添加静态方法,三种方式 1.添加新的全局函数 2 ...
    
		
    4. 
						
  4. 再谈：jquery编写插件的方法
		
    版权声明:作者原创,转载请注明出处! 编写插件的两种方式: 1.类级别开发插件(1%) 2.对象级别开发(99%) 类级别的静态开发就是给jquery添加静态方法,三种方式 1.添加新的全局函数 2. ...
    
		
    5. 
						
  5. 两个jquery编写插件实例
		
    (1) 封装基于jq弹窗插件   相信码友们对于$.fn.extexd();$.extend()以及$.fn.custom和$.custom都有一定的了解:我阐述一下我自己对于$.fn.custom和 ...
    
		
    6. 
						
  6. jquery编写插件（转）
		
    教你开发jQuery插件(转)   阅读目录 基本方法 支持链式调用 让插件接收参数 面向对象的插件开发 关于命名空间 关于变量定义及命名 压缩的好处 工具 GitHub Service Hook 原 ...
    
		
    7. 
						
  7. jQuery编写插件--封装全局函数的插件（一些常用的js验证表达式）
		
    上一篇写到了jQuery插件的3种类型,介绍了第一种类型的写法--封装jQuery对象的方法插件.这一篇要介绍第二种插件类型:封装全局函数的插件:这类插件就是在jQuery命名空间内部添加函数:这类插 ...
    
		
    8. 
						
  8. jquery 编写插件入门
		
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <sc ...
    
		
    9. 
						
  9. 用jquery编写的分页插件
		
    用jquery编写的分页插件 源码 function _pager_go(total_page) { var page_str = $("#_pager_textbox").val ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. MAC OS X 终端命令入门 （简单常用整理）
			
    在这里记下..防止丢失 pwd 当前工作目录 cd(不加参数) 进root cd(folder) 进入文件夹 cd .. 上级目录 cd ~ 返回root cd - 返回上一个访问的目录 rm 文件名 ...
    
			
    2. 
						
  2. 进程环境之main函数
			
    C程序总是从main函数开始执行.main函数的原型是: int main( int argc, char *argv[] ); 其中,argc是命令行参数的数目,argv是指向参数的各个指针所构成的 ...
    
			
    3. 
						
  3. keepalived + haproxy 实现web 双主模型的高可用负载均衡--转
			
    原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://xz159065974.blog.51cto.com/8618592/140581 ...
    
			
    4. 
						
  4. phpcms 源码分析一： common.inc.php
			
      其实就是从网上找到的的逆雪寒的分析, 我下来之后发现格式和错字的问题,非常影响阅读,现在我就是做了下搬运工的角色, 同时将格式调整到可读性提高点而已,让各位看官稍微舒心点: 下面进入整体: < ...
    
			
    5. 
						
  5. HDU1010(bfs)
			
    #include <stdio.h>#include <iostream>#include <string.h>#include <stdlib.h>u ...
    
			
    6. 
						
  6. java查询手机号码归属地
			
    package com; import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamRe ...
    
			
    7. 
						
  7. [Form Builer]Locking Mode and LOCK_RECORD
			
    Locking Mode Property Description Specifies when Oracle Forms tries to obtain database locks on rows ...
    
			
    8. 
						
  8. magento 常用的函数
			
    1.Magento eav_attribute表中source如何指定自定义数据来源  如果你引用的类名为yebihai_usermanage_model_entity_school你必须完整的给出地 ...
    
			
    9. 
						
  9. 移动端Web页面问题
			
    1.安卓浏览器看背景图片,有些设备会模糊.   用同等比例的图片在PC机上很清楚,但是手机上很模糊,原因是什么呢? 经过研究,是devicePixelRatio作怪,因为手机分辨率太小,如果按照分辨率 ...
    
			
    10. 
						
  10. react 学习之十月之思
			
    学习新技术,最怕的莫过于自己抱着莫大的决心去学习,然发现没有学到东西,这是很可怕的事情,但是能坚持下去,一点一点的消化知识点,并且去理解它是什么?有什么用?该怎么去用?使用的时候需要注意些什么呢? 这 ...
    
			
    11.