$.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效。 
如扩展$.fn.abc(),即$.fn.abc()是对jquery扩展了一个abc方法,那么后面你的每一个jquery实例都可以引用这个方法了. 
那么你可以这样子:$("#div").abc();

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

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

fn是什么东西呢。查看jQuery代码,就不难发现。

复制代码代码如下:

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

原来 jQuery.fn =jQuery.prototype.对prototype肯定不会陌生啦。 
jQuery便是一个封装得非常好的类,比如我们用语句 $("#btn1") 会生成一个 jQuery类的实例。

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

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

便为 jQuery 添加一个为add 的 “静态方法”,之后便可以在引入 jQuery 的地方,使用这个方法了, 
$.add(3,4); //return 7

jQuery.fn.extend(object);对jQuery.prototype进得扩展,就是为jQuery类添加“成员函数”。jQuery类的实例可以使用这个“成员函数”。 
比如我们要开发一个插件,做一个特殊的编辑框,当它被点击时,便alert当前编辑框里的内容。可以这么做:

jQuery代码


$.fn.extend({

alertWhileClick:function(){

$(this).click(function(){

alert($(this).val()); 
}); 

});

来源于:http://www.jb51.net/article/42816.htm

转载于:https://www.cnblogs.com/chj929555796/p/5556030.html

jquery扩展 $.fn相关推荐

  1. jQuery的$.fn使用

    jquery中文网为您提供jQuery的$.fn使用等资源,欢迎您收藏本站,我们将为您提供最新的jQuery的$.fn使用资源 $.fn是指jquery的命名空间,加上fn上的方法及属性,会对jque ...

  2. jQuery ready(fn) 页面载入函数

    ready(fn)当DOM载入就绪可以查询及操纵时绑定一个要执行的函数.这是事件模块中最重要的一个函数,因为它可以极大地提高web应用程序的响应速度.         简单地说,这个方法纯粹是对向wi ...

  3. 关于jquery的$.fn和$

    2019独角兽企业重金招聘Python工程师标准>>> Q:再问一个,jquery的插件中有$.fn.xxxx = function() {xxx} 这里的fn是干嘛的 $就是指jQ ...

  4. jQuery中$.fn的用法示例介绍

    $.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效,下面有个不错的示例,喜欢的朋友可以参考下 $.fn是指jquery的命名空间,加上fn上的方法及属性,会对j ...

  5. 用Jquery控制文本框只能输入数字和字母及jquery自定义方法$.fn

    封装成onlyNum(),onlyAlpha()和onlyNumAlpha()3个Jquery扩展方法,方便复用,由于里面一些JS代码涉及到了"禁用输入法,获取剪切板的内容",而& ...

  6. jQuery中$.fn的用法

    在jQuery插件中,常常看见这样的结构,开始自己也是不理解后来通过查阅资料,慢慢的理解其中的大意,所以先总结出来. (function( $, window, document, undefined ...

  7. jquery 中 fn.apply(this, arguments)是什么函数?有什么作用?能举个例子吗

    1 function Person(name){ 2 this.name=name; 3 this.sayname=function (){ 4 alert(this.name); 5 } 6 } 7 ...

  8. jQuery: 插件开发模式详解 $.extend(), $.fn, $.widget()

    原文:http://www.codeceo.com/article/jquery-plugin-develop.html 软件开发过程中是需要一定的设计模式来指导开发的,有了模式,我们就能更好地组织我 ...

  9. (function($){...})(jQuery)、$(function(){ })和$.fn

    部分转自:http://blog.csdn.net/rambo_china/article/details/7742321 表示感谢! (function($){-})(jQuery) 首先funct ...

  10. jquery 1.7.2源码解析(二)构造jquery对象

    构造jquery对象 jQuery对象是一个类数组对象. 一)构造函数jQuery() 构造函数的7种用法: 1.jQuery(selector [, context ]) 传入字符串参数:检查该字符 ...

最新文章

  1. 深度学习 英文 训练阶段_半监督深度学习训练和实现小Tricks
  2. android Anr Input类型系统源码解析
  3. Server Tomcat v6.0 Server at localhost was unable to start within 45 seconds...
  4. webpack结合reactjs、vuejs项目中图片处理
  5. AGV控制器设计与融合
  6. android studio 显示方法列表,有没有办法在Android Studio编辑器中显示RecyclerView内容的预览?...
  7. k8s:Service的四种类型和三种代理模式
  8. SQL Server链接服务器 Linked Server
  9. 012 注解式异常处理器
  10. 【待填坑】LG_3239_[HNOI2015]亚瑟王
  11. 水经微图与万能地图下载器功能比较
  12. kali-2019.4中文乱码问题的解决
  13. 小刘的刷题日记——day1 【CSES】Weird Algorithm
  14. 技术工作总结报告安全性设计报告用户手册如何编写
  15. 小啊呜产品读书笔记001:《邱岳的产品手记-05》第9讲 产品案例分析:Hopper的“人工智能” 第10讲 产品被抄袭了怎么办?
  16. 熬秃了头整理的网络工程师学习笔记和心得:传闻中的OSPF到底是什么
  17. UnityHub 无需登录 傻瓜教程 一键搞定
  18. 国企面试-260题-单选题 下列哪组成语反映了同一种人际关系: A 琴瑟和鸣 破镜重圆 B 负荆请罪 载舟覆舟 C 结草衔环 青梅竹马 D 相濡以沫 舐犊情深
  19. Linux 监控工具之Cacti使用详解(一)
  20. GBase基本查询操作

热门文章

  1. Java分词处理测试
  2. golang protobuf 动态消息获取_干货|Golang拦截器的一种实现
  3. pytorch加载自己的数据集图片格式
  4. Deep Learning for Content-Based Image Retrival:A Comprehensive Study 论文笔记
  5. Keras中的时间分布层TimeDistributed Layer使用教程
  6. 机器学习方法(二)——xgboost(原理篇)
  7. 语法错误 : 缺少“;”(在“<”的前面)
  8. 学计算机用多大的u盘合适,u盘装系统需要多大的u盘|装系统需要多大的U盘
  9. matlab solve 矩阵方程,用solve函数能求解带有未知数的矩阵方程组吗
  10. 英文标题大写格式化 在线网站