我们该如何扩展jQuery呢？主要可以通过下面2个来扩展：$.extend 和 $.fn

$.extend
如果把jQuery当成一个类，$.extend相当于为该类添加了静态方法extend。

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>demo</title>

</head>

<body>

  <script src="jquery.js"></script>

  <script>

      $.extend({

          log: function(message) {

              var now = new Date(),

                  y = now.getFullYear(),

                  m = now.getMonth() + 1,

                  d = now.getDate(),

                  h = now.getHours(),

                  min = now.getMinutes(),

                  s = now.getSeconds(),

                  time = y + '/' + m + '/' + d + ' ' + h + ':' + min + ':' + s;

                  console.log(time + ' My App: ' + message);

          }

      });

      $.log("出错啦！");

  </script>

</body>

</html>

　　$.fn等于$.prototype

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>demo</title>

</head>

<body>

  <p class="text1">测试文字</p>

  <p class="text2">测试文字</p>

  <script src="jquery.js"></script>

  <script>

      $.fn.changeColor = function(options){

          this.defaults = {

              'color': '#000',

              'fontSize': '14px',

              'fontWeight': 'normal'

          };

          this.opt = $.extend(this.defaults, options);

          console.log(this.defaults);

          this.css({

              'color': this.opt.color,

              'font-size': this.opt.fontSize,

              'font-weight': this.opt.fontWeight

          });

      }

      $(".text1").changeColor();

      $(".text2").changeColor({'color': '#f06','fontSize': '18px','fontWeight': 'bold'});

  </script>

</body>

</html>

　　

将我们要实现的代码封装在

;(function($,window,document,undefined){

    //想要实现的功能的代码

})(jQuery,window,document);
这里的"；"最好添加上，可以避免代码压缩时出现问题

jQuery插件开发详解的更多相关文章

  1. jQuery：详解jQuery中的事件（二）

    上一篇讲到jQuery中的事件,深入学习了加载DOM和事件绑定的相关知识,这篇主要深入讨论jQuery事件中的合成事件.事件冒泡和事件移除等内容. 接上篇jQuery:详解jQuery中的事件(一) ...

  2. jQuery.validator 详解二

    前言:上一篇详细的介绍了jQuery.validator( 版本v1.13.0 )的验证规则,这一篇重点讲述它的源码结构,及如何来对元素进行验证,错误消息提示的内部实现 一.插件结构(组织方式) 在讲 ...

  3. jQuery.validator 详解

    jQuery.validator 详解二 前言:上一篇详细的介绍了jQuery.validator( 版本v1.13.0 )的验证规则,这一篇重点讲述它的源码结构,及如何来对元素进行验证,错误消息提示 ...

  4. jquery方法详解

    jquery方法详解 http://www.365mini.com/doc

  5. Android Studio 插件开发详解四：填坑

    转载请标明出处:http://blog.csdn.net/zhaoyanjun6/article/details/78265540 本文出自[赵彦军的博客] 在前面我介绍了插件开发的基本流程 [And ...

  6. Android Studio 插件开发详解三：翻译插件实战

    转载请标明出处:http://blog.csdn.net/zhaoyanjun6/article/details/78113868 本文出自[赵彦军的博客] 一:概述 如果不了解插件开发基础的同学可以 ...

  7. Android Studio 插件开发详解二：工具类

    转载请标明出处:http://blog.csdn.net/zhaoyanjun6/article/details/78112856 本文出自[赵彦军的博客] 在插件开发过程中,我们按照开发一个正式的项 ...

  8. Android Studio 插件开发详解一：入门练手

    转载请标明出处:http://blog.csdn.net/zhaoyanjun6/article/details/78112003 本文出自[赵彦军的博客] 一:概述 相信大家在使用Android S ...

  9. Jquery 选择器 详解 js 判断字符串是否包含另外一个字符串

    Jquery 选择器 详解   在线文档地址:http://tool.oschina.net/apidocs/apidoc?api=jquery 各种在线工具地址:http://www.ostools ...

随机推荐

  1. git 使用系列（一）—— git stash 的使用

    1. git 放弃本地修改 git checkout . #本地所有修改的.没有的提交的,都返回到原来的状态 git stash #把所有没有提交的修改暂存到stash里面.可用git stash p ...

  2. error: QApplication: No such file or directory

    尝试用Qt5编译Qt4的工程.你会遇到下面的问题: 错误:C1083: 无法打开包括文件:“QApplication”: No such file or directory 出现原因:Qt5里不再用Q ...

  3. KVO & 通知 小记

    KVO的全称是Key-Value Observing,它实现了一种机制,对所关心的属性对象添加观察者,当属性值发生变化时会得到通知,我们可以对变化做相应的处理.看过设计模式的同学应该知道,这是一种典型 ...

  4. 搭建App主流框架_纯代码搭建(OC)

    转载自:http://my.oschina.net/hejunbinlan/blog/529778?fromerr=EmSuX7PR 搭建主流框架界面 源码地址在文章末尾 达成效果 效果图 注:本文部 ...

  5. editplus 常用

    个人习惯风格基本设置:document >preferences >fonts|( Comic sans MS  blod 18) -------------------- \n 去换行 ...

  6. Windows上mxnet实战深度学习：Neural Net

    前提: 假设已经在Windows上安装配置好mxnet和python语言包. 假设mxnet安装目录为D:\mxnet 假设已安装好wget 可以参考 这篇文章 打开Windows的命令提示符: 执行 ...

  7. WPF教程：依赖属性

    一.什么是依赖属性 依赖属性就是一种自己可以没有值,并且可以通过绑定从其他数据源获取值.依赖属性可支持WPF中的样式设置.数据绑定.继承.动画及默认值. 将所有的属性都设置为依赖属性并不总是正确的解决 ...

  8. .NET的对象映射工具AutoMapper使用笔记

    AutoMapper是一个.NET的对象映射工具. 项目地址:https://github.com/AutoMapper/AutoMapper. 帮助文档:https://github.com/Aut ...

  9. NBUT 1457 Sona

    莫队算法+离散化 1.map会TLE,必须离散化做 2.long long会WA,__int64定义 %I64d输出输出能AC 3.注意输入的序列会爆int #include<cstdio> ...

  10. CodeForces 620E New Year Tree

    线段树+位运算 首先对树进行DFS,写出DFS序列,记录下每一个节点控制的区间范围.然后就是区间更新和区间查询了. 某段区间的颜色种类可以用位运算来表示,方便计算. 如果仅有第i种颜色,那么就用十进制 ...