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

    查看gcc版本号 rpm -qa | grep gcc gnu的gcc是linux/unix下开发的,不能直接在window下运行.window下有gcc的移植版本.就是楼上说的MinGW和cygwi ...

  2. 获取随机颜色js

    获取随机颜色方法一: function randomColor1() { var rand = Math.floor(Math.random() * 0xFFFFFF).toString(16); i ...

  3. java学习笔记--1_常见输入输出语句熟悉篇章

    今天上oj,想来是准备做做算法和数据结构的.看了看以前做的基础题目,想着就先熟悉一下java的语言吧! 以下是今天做的10道题目. 备注:oj有时候对格式要求非常严格,因为不在格式上纠结太久,只要ec ...

  4. iOS toolbar

    初学ios,对toolbar初步了解: self.navigationItem.title=@"显示工具栏"; // 显示工具栏 //self.navigationControll ...

  5. Android 里面的小坑

    1.listview加了个blockdescen,竟然导致editTextView不能获取焦点

  6. 解析包时出现错误,用代码安装apk出现问题

    Intent intent = new Intent(Intent.ACTION_VIEW); intent.setDataAndType(Uri.fromFile(file),"appli ...

  7. MFC对话框程序EDIT类控件的自动换行,垂直滚动条自动下移

    1.新建一个Edit Control,将其Multiline属性设置为True,Auto HScroll属性设置False,这样就可以实现每一行填满后自动换行了.   2.再将Vetrical Scr ...

  8. 初学c++

    今天在计蒜客中学习了c++的语句编写方法.因为之前编程时候用的都是c,所以第一次看到c++的部分代码还是有点迷茫忙的. 初次接触c++,我学习到了c++中变量的定义以及输入输出. 代码如下: #inc ...

  9. 鼠标操作[OpenCV 笔记10]

    ) winname 窗口名字 onMouse 指定窗口每次鼠标事件发生的时候,被调用的函数指针.函数的原型应为void Foo(int event, int x, int y, int flags, ...

  10. Codeforces Round #80 Div.1 D

    思路:考虑离线操作,以y为关键字排序,对于y相同的一起操作,然后考虑y的范围,当y<=sqrt(n)时,直接O(n)预处理出f[x]表示f[x]+f[x+y]+f[x+2*y]+..+f[x+k ...