该了解我们也知道的差不多了,接下来编写我们第一个jq插件吧

封装对象方法的插件

我们编写一个设置和获取颜色的插件,我们需要实现两个功能

1、设置匹配元素的颜色

2、获取匹配元素(元素集合的第一个)的颜色

我们采用jQuery.fn.extend(),代码如下:

;(function($){
/* code */
})(jQuery)

这是最外层的架构,接下来;

   ;(function($){
$.fn.extend({
color:function(val){
// code
}
});
})(jQuery)

我在里面添加相应的代码

;(function($){
$.fn.extend({
color:function(val){
console.log(val);
if(val == undefined){
return this.css('color');
}
else{
return this.css('color',val);
}
}
});
})(jQuery)

我们采用jq 的css()方法和获取颜色值;插件的this指向的是jq对象,如果插件不返回特定的值或字符串,应该使其具有可连性,为此直接返回this对象,由于css()方法定义了的返回对象,直接返回即可;

封装我们的jq.color.js

页面调用 该js

console.log($("div").color());
console.log($("div").color("red"));

编写JQuery插件-3的更多相关文章

  1. 编写jQuery插件--实现返回顶部插件

    国庆过去一周多了,作为IT界的具有严重’工作狂‘性质的宅人,居然还没走出玩耍的心情,拖了程序猿的脚后跟了.最近工作不顺,心情不佳,想吐槽下公司,想了还是厚道点,以彼之道还施彼身,觉得自己也和他们同流合 ...

  2. 编写jQuery插件(一)——插件约定及插件中的闭包

    编写插件的目的是给已经有的一系列方法或函数做一个封装,以便在其他地方重复使用,提高开发效率和方便后期维护. 在编写jQuery插件的时候,我们一般会遵循一些约定: jQuery插件推荐命名为:jque ...

  3. 自己编写jQuery插件之表单验证

    自己编写jQuery插件之表单验证 吐个嘈先:最近状态不咋滴,真是什么都不想干,不想上班,做什么都没动力,觉得没意思.不想这样,不想这样,快让这种情绪消失吧,忽忽.... 表单验证在项目中用的还是比较 ...

  4. 自己编写jQuery插件之Tab切换

    自己编写jQuery插件之 Tabs切换 jquery ui 带有Tabs切换插件,但其css样式太难维护,引用的东西太多,因此就自己写了个. 起初我Html代码架子是这样的: <div cla ...

  5. 编写jQuery插件的方法和注意点

    编写jQuery插件的方法和注意点 插件的种类 jQuery的插件主要分为3种类型. 1. 封装对象方法的插件 这种插件是将对象方法封装起来,用于对通过选择器获取的jQuery对象进行操作,是最常见的 ...

  6. 如何编写JQuery 插件详解

    转载自:http://blog.sina.com.cn/s/blog_6154bf970101jam7.html 如今做web开发,jquery 几乎是必不可少的,就连vs神器在2010版本开始将Jq ...

  7. 如何用正确的姿势编写jQuery插件

    在园子里有很多关于jQuery插件的文章,尤其 以下2篇文章: 不定义JQuery插件,不要说会JQuery jQuery插件开发精品教程,让你的jQuery提升一个台阶 这2位大神基础讲的很清楚,在 ...

  8. 如何编写jQuery插件

    要说jQuery 最成功的地方,我认为是它的可扩展性吸引了众多开发者为其开发插件,从而建立起了一个生态系统.这好比大公司们争相做平台一样,得平台者得天下.苹果,微软,谷歌等巨头,都有各自的平台及生态圈 ...

  9. 编写jQuery 插件

    编写jQuery Plugin,要设置默认值,并允许用户修改默认值,或者运行是传入其他值. 最终,我们得出编写一个jQuery插件的原则: 给$.fn绑定函数,实现插件的代码逻辑: 插件函数最后要 r ...

  10. 编写jquery插件的分享

    一.类级别($.extend) 类级别你可以理解为拓展jquery类,最明显的例子是$.ajax(...),相当于静态方法. 开发扩展其方法时使用$.extend方法,即jQuery.extend(o ...

随机推荐

  1. 转 Could not create the view: An unexpected exception was thrown.问题解决

    转自:http://blog.csdn.net/shuangzixing520/article/details/35225105 今天打开Myeclipse10的时候,发现server窗口出现一堆问题 ...

  2. nginx keepalived 主从切换

    注:  LVS + Keepalived  不知道为什么出现一个很郁闷的问题....... ------------------------------------------------------ ...

  3. 使用Pushlet来实现服务器端向客户端推送信息

        使用Pushlet来实现服务器端向客户端推送信息 1.   实现方式: 有两种实现方式: 1.         通过配置文件来实现定时的从服务器端向客户端推送信息 2.         通过A ...

  4. [iOS Animation]-CALayer 视觉效果

    视觉效果 嗯,圆和椭圆还不错,但如果是带圆角的矩形呢? 我们现在能做到那样了么? 史蒂芬·乔布斯 我们在第三章『图层几何学』中讨论了图层的frame,第二章『寄宿图』则讨论了图层的寄宿图.但是图层不仅 ...

  5. Git for Windows 工具下载及配置

    前言,关于git工具的帖子:http://cn.v2ex.com/t/225027 最终选择了git for windows这个工具,路径为:https://git-for-windows.githu ...

  6. 学习wcf

    链接请看下面 第一部分:http://boytnt.blog.51cto.com/966121/796884 第二部分:http://boytnt.blog.51cto.com/966121/7969 ...

  7. cpptoolstip界面提示库使用

    很多时候写一些界面程序,需要实时的给用户提示,每次都弹出一个messagebox挺烦的,状态栏又怕人看不到,最后找了一个相关的类,显示效果不错,分享一下,效果如下 下载库下来之后对应八个文件 将八个文 ...

  8. Delphi 内存分配 StrAlloc New(转)

    源:Delphi 内存分配 StrAlloc New 引自:http://anony3721.blog.163.com/blog/static/5119742010824934164/   给字符指针 ...

  9. uCOS-iii 中定义的一些常量

    uCOS-iii 中定义的一些常量 uCOS-iii 中有许多宏定义的量,这些量不需要全部记住是什么意思,因为在阅读代码的时候可以选中变量或宏定义然后右键查看定义,就可以知道它代表的什么意思.但是如果 ...

  10. BootStrap TreeView使用示例

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...