分享一下编写设置和获取颜色的插件,首先我将插件的名字命名为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. javascript&&jquery编写插件模板

    javascrpt插件编写模板 这里不分享如何编写插件,只留一个框架模板,使用面向对象的形式进行编写,方便管理 ;(function(window,document){ function FnName ...

  3. jquery编写插件的方法

     版权声明:作者原创,转载请注明出处! 编写插件的两种方式: 1.类级别开发插件(1%) 2.对象级别开发(99%) 类级别的静态开发就是给jquery添加静态方法,三种方式 1.添加新的全局函数 2 ...

  4. 再谈:jquery编写插件的方法

    版权声明:作者原创,转载请注明出处! 编写插件的两种方式: 1.类级别开发插件(1%) 2.对象级别开发(99%) 类级别的静态开发就是给jquery添加静态方法,三种方式 1.添加新的全局函数 2. ...

  5. 两个jquery编写插件实例

    (1) 封装基于jq弹窗插件   相信码友们对于$.fn.extexd();$.extend()以及$.fn.custom和$.custom都有一定的了解:我阐述一下我自己对于$.fn.custom和 ...

  6. jquery编写插件(转)

    教你开发jQuery插件(转)   阅读目录 基本方法 支持链式调用 让插件接收参数 面向对象的插件开发 关于命名空间 关于变量定义及命名 压缩的好处 工具 GitHub Service Hook 原 ...

  7. jQuery编写插件--封装全局函数的插件(一些常用的js验证表达式)

    上一篇写到了jQuery插件的3种类型,介绍了第一种类型的写法--封装jQuery对象的方法插件.这一篇要介绍第二种插件类型:封装全局函数的插件:这类插件就是在jQuery命名空间内部添加函数:这类插 ...

  8. jquery 编写插件入门

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <sc ...

  9. 用jquery编写的分页插件

    用jquery编写的分页插件 源码 function _pager_go(total_page) { var page_str = $("#_pager_textbox").val ...

随机推荐

  1. web工程中spring+ibatis的单元测试--转载

    为了保证代码的正确,软件的质量,单元测试几乎是每个程序员都要面临的工作了;而开发中大部分的工作都涉及数据库的操作,也就是平时经常可以看到的DAO了;由于是对数据库的操作,就必然有事务的问题了;如果是启 ...

  2. Top 10 Questions about Java Exceptions--reference

    reference from:http://www.programcreek.com/2013/10/top-10-questions-about-java-exceptions/ This arti ...

  3. jQuery免费资料

     JQvery免豆.pdf       jQuery实战之仿flash跳动的按钮效果[源码]http://down.51cto.com/data/188600JQuery 1.4.2 手册简体中文版h ...

  4. ios开发时候,出现A valid provisioning profile for this executable was not found 错误

    今天一大早起来,做ios的开发,发现了一下错误:A valid provisioning profile for this executable was not found 错误的产生是在开发模式下产 ...

  5. GCC安装

    1.apt-get install gcc2.apt-get install make3.apt-get install gdb apt-get install build-essential  这个 ...

  6. Ubuntu14.04服务器安装ftp

    随笔记录一下Ubuntu下安装ftp 1.远程连接登录服务器之后,输入sudo apt-get update 并回车.如果不运行该命令,直接安装vsftpd,可能会出现有一些软件包无法下载. 2.输入 ...

  7. mac install php dev

    环境开发配置 mysql 下载mysql压缩包.tar.gz 解压 mv mysql_5.7.10_osx... /usr/local/mysql sudo chown -R root:wheel / ...

  8. redis resque消息队列

    Resque 目前正在学习使用resque .resque-scheduler来发布异步任务和定时任务,为了方便以后查阅,所以记录一下. resque和resque-scheduler其优点在于功能比 ...

  9. Python 基础【第三篇】输入和输出

    这里我们创建一个python(pytest)脚本用于学习测试(以后都为这个文件,不多做解释喽),这个文件必须要有执行权限的哈 1.创建pytest并赋予执行权限 [root@fengyuba_serv ...

  10. 20160408javaweb之JDBC ---PreparedStatement

    PreparedStatement 1.Sql注入:由于jdbc程序在执行的过程中sql语句在拼装时使用了由页面传入参数,如果用户恶意传入一些sql中的特殊关键字,会导致sql语句意义发生变化,这种攻 ...