$.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当前编辑框里的内容。可以这么做:

$.fn.extend({ 

alertWhileClick:function(){ 

$(this).click(function(){ 

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

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

jQuery中$.fn的用法示例介绍的更多相关文章

  1. jquery 之$.fn的用法示例

    $.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效. 若扩展$.fn.abc(),即$.fn.abc()是对jquery扩展一个abc的方法,那么每个jquer ...

  2. jQuery中$.fn的用法

    原文:http://www.jb51.net/article/42816.htm $.fn是指jquery的命名空间,$.fn=$.prototype. 1.$.extend 为jquery添加静态方 ...

  3. JS中数组Array的用法示例介绍 (转)

    new Array() new Array(len) new Array([item0,[item1,[item2,...]]] 使用数组对象的方法: var objArray=new Array() ...

  4. document.forms用法示例介绍

    概述 forms 返回一个集合 (一个HTMLCollection对象),包含了了当前文档中的所有form元素. 语法 var collection = document.forms; documen ...

  5. jquery.validate.min.js 用法方法示例

    页面html 代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

  6. jquery中的$.fn的用法

    JQuery里的原型prototype分析       http://www.nowamagic.net/librarys/veda/detail/653 jquery中的$.fn的用法       ...

  7. jQuery中on()方法用法实例详解

    这篇文章主要介绍了jQuery中on()方法用法,实例分析了on()方法的功能及各种常见的使用技巧,并对比分析了与bind(),live(),delegate()等方法的区别,需要的朋友可以参考下 本 ...

  8. jquery中$.each()的用法

    each()函数是基本上所有的框架都提供了的一个工具类函数,通过它,你可以遍历对象.数组的属性值并进行处理.jQuery和jQuery对象都实 现了该方法,对于jQuery对象,只是把each方法简单 ...

  9. 腾讯云上PhantomJS用法示例

    崔庆才 前言 大家有没有发现之前我们写的爬虫都有一个共性,就是只能爬取单纯的html代码,如果页面是JS渲染的该怎么办呢?如果我们单纯去分析一个个后台的请求,手动去摸索JS渲染的到的一些结果,那简直没 ...

随机推荐

  1. MicroERP数据初始化SQL脚本

    --use MicroERP insert into tbUserGroup(GroupName,Remark) values('管理员组','具备所有权限')insert into tbUser(L ...

  2. 关闭SqlServer连接

    经常使用需要还原数据库又不想关闭已经打开的画面,所以直接上 CREATE PROCEDURE [dbo].[StopLogin] ) AS DECLARE ), ) BEGIN IF (@Dname ...

  3. Ant_的最完整build.xml解释

    Ant的概念 Make命令是一个项目管理工具,而Ant所实现功能与此类似.像make,gnumake和nmake这些编译工具都有一定的缺陷,但是Ant却克服了这些工具的缺陷.最初Ant开发者在开发跨平 ...

  4. Dojo的Gridx使用jsonrest需要注意的地方

    在使用gridx时,如果要使用jsonrest,主要的工作主要是在服务端,服务端在返回数据时,必须在返回头里添加Content-Range: 0-9/73 属性和值,其中0表示从第0条记录开始,9表示 ...

  5. js实现全选反选功能

    开始慢慢地学习js&jQuery. function clicked(){ var arr=document.getElementsByName("product"); f ...

  6. qt做触摸屏演示程序

    界面效果图: 参考资料: http://blog.csdn.net/orz415678659/article/details/9136575     这个最重要.. https://www.oschi ...

  7. Lucky 2048 - The secret of being lucky

    Lucky 2048 uses a normal distribution to create "lucky" start. Generally speaking, it prov ...

  8. fushioncharts 使用教程要点---使用JSON数据方式

    1.建立图表步骤: A.下载fushionChart,引入FusionCharts.js和FusionChartsExportComponent.js文件 B.建立图表对象 var chart1 =  ...

  9. The first day to learn Englisht

    IF you want to go fast,to alone. IF you want to go far,go with others.

  10. HTML5的form表单属性

    form:HTML4中,表单内的从属元素必须书写在<form></form>之内,但是在HTML5中,表单的从属元素可以处于页面的任何位置,然后为其添加form属性,属性值为f ...