jQuery为扩展插件提拱了两个方法,分别是:

  • jQuery.extend(object) —— 给jQuery对象添加方法。
  • jQuery.fn.extend(object) —— 为扩展jQuery类本身.为类添加新的方法;

fn表示什么呢?下面代码是jQuery源代码中定义的fn:

jQuery.fn = jQuery.prototype = {
   init: function( selector, context ) {     //…… };

从上面代码我们不难看出 jQuery.fn = jQuery.prototype。对于prototype肯定不会陌生, javascript没有明确的类的概念,但是为也更方便理解它我们通常会用到类。

那么有fn和没有fn有什么区别呢?

jQuery.extend(object); 为jQuery类添加添加类方法,可以理解为添加静态方法。

如以下代码:

$.extend({
  add:function(a,b){return a+b;}
});

这样就表示为 jQuery 添加一个为 add 的 “静态方法”,之后便可以在引入 jQuery的地方,通过$.add();就可以使用这个方法了,

jQuery.fn.extend(object); 对jQuery.prototype进行扩展,就是为jQuery类添加“成员函数”。jQuery类的实例可以使用这个“成员函数”。

如以下代码:

$.fn.extend({
alertWhileClick:function(){
$(this).click(function(){
alert($(this).val());
});
}
});

此时我们就可以通过 $('input').alertWhileClick();来调用这个方法了。这个里面的$('input')为jQuery的一个实例,当它调用成员方法 alertWhileClick后,便实现了扩展。

参考文档:https://www.cnblogs.com/keyi/p/6089901.html

jQuery插件扩展方法的更多相关文章

  1. Jquery自定义扩展方法(二)--HTML日历控件

    一.概述 研究了上节的Jquery自定义扩展方法,自己一直想做用jquery写一个小的插件,工作中也用到了用JQuery的日历插件,自己琢磨着去造个轮子--HTML5手机网页日历控件,废话不多说,先看 ...

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

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

  3. JS,JQuery的扩展方法

    转 http://blog.csdn.net/tuwen/article/details/11464693 //JS的扩展方法: 1 定义类静态方法扩展 2 定义类对象方法扩展            ...

  4. jQuery插件制作方法详解

        jQuery插件制作方法详解   jquery插件给我的感觉清一色的清洁,简单.如Jtip,要使用它的功能,只需要在你的元素的class上加 上Jtip,并引入jtip.js及其样式即可以了. ...

  5. jquery validate验证插件扩展方法(转)

    /***************************************************************** jQuery Validate扩展验证方法 (linjq) *** ...

  6. JQuery 插件一般方法

    如今做web开发,jquery 几乎是必不可少的,就连vs神器在2010版本开始将Jquery 及ui 内置web项目里了.至于使用jquery好处这里就不再赘述了,用过的都知道.今天我们来讨论下jq ...

  7. 为Jquery类和Jquery对象扩展方法

    转:https://www.cnblogs.com/keyi/p/6089901.html jQuery为开发插件提拱了两个方法,分别是: JavaScript代码 jQuery.fn.extend( ...

  8. JavaScript | JQuery插件定义方法

    参考 http://www.2cto.com/kf/201507/417874.html ——————————————————————————————————————————————————————— ...

  9. jquery插件扩展的学习

    jquery插件的学习可以点击这里 举个例子 //首先先来一个插件 (function($){ $.fn.extent({ bigfont:function(){ return this.css('f ...

随机推荐

  1. 使用VUE+iView+.Net Core上传图片

    我们直接进入主题,使用VS2017开发工具 首先要创建一个WebApi项目,创建完之后,在wwwroot文件下,创建一个文件夹 名字可以随意起  我这里呢就叫做Upload了 ok ! 然后我们再创建 ...

  2. 工作总结 EntityFramework中出现DateTime2异常的完美解决办法

    EntityFramework中出现DateTime2异常的完美解决办法   今天在使用entityframework往数据库插入数据的时候,突然出现了一个数据类型转换异常的问题: System.Da ...

  3. SYS_数据访问权限Operation Unit和Ledger的访问设定(案例)

    2014-06-01 Created By BaoXinjian

  4. CentOS7 安装配置DNS服务器

    一.安装 yum install bind 二.配置 1. /etc/named.conf // // named.conf // // Provided by Red Hat bind packag ...

  5. 机器学习(3):支持向量机(SVM)

    1. 背景:      1.1 最早是由 Vladimir N. Vapnik 和 Alexey Ya. Chervonenkis 在1963年提出      1.2 目前的版本(soft margi ...

  6. django中跨app引用model

    可能是自己水平的原因,总感觉跨django中app引用有点怪怪的,所以在自己没有达到另一个级别之前就先把正确的解决 方案记一下吧. 一.django中跨app引用model,以app02中的model ...

  7. Spring Bean的生命周期详解(转)

    Spring作为当前Java最流行.最强大的轻量级框架,受到了程序员的热烈欢迎.准确的了解Spring Bean的生命周期是非常必要的.我们通常使用ApplicationContext作为Spring ...

  8. CSS控制当鼠标滑过时更换图片的效果

    鼠标滑过时更换图片的效果有很多方法可以实现,在本文将为大家介绍喜爱如何通过css来实现.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tra ...

  9. TensorFlow运作方式入门

    TensorFlow运作方式入门 代码:tensorflow/g3doc/tutorials/mnist/ 本篇教程的目的,是向大家展示如何利用TensorFlow使用(经典)MNIST数据集训练并评 ...

  10. 自己用的C++编码规范

    头文件结构 #ifndef COMMUNICATERHANDLLER_H #define COMMUNICATERHANDLLER_H #include "ace/Guard_T.h&quo ...