$.fn与$.extend简单总结与例子

还是老样子 看到了不懂得代码 找了几篇文章看了看 作如下总结

Jquery为开发插件提供了两种方法

$.fn 为每一个实例提供拓展  用于添加单个方法

$.extend 为Jquery类提供扩展 可以理解为静态方法  用于添加多个方法

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

jQuery.fn = jQuery.prototype ={

　　　init: function( selector, context ){//....　

　　　//......

};

原来 jQuery.fn =jQuery.prototype

下面是自己写的小Demo

(function($){
	$.fn.extend({//扩展outPut方法 
		outPut:function(args){
			console.info(args);
		}
	});
	
	$.fn.outPut = function(args){//与上面相同
		console.info(args);
	};
	$.extend({//同时扩展 加法与减法   至
			//于为什么放在匿名函数里面 (会做为私有方法 但是放在外面也可以使用....目前本人还不是太理解 求教ing....)
		add:function(a,b){
			return a+b;
		},
		div:function(a,b){
			return a-b;
		}
	});
	
})($);

$(function(){
								//放在onload函数里面 才可以 否则XXX is Not a function (可能文档没有加载完吧...)
	$("#type").outPut('123');	//经过$.fn 扩展的 需要Jquery 实例 调用
	var sum = $.add(3,4);		//$.extend 扩展的 相当于类方法 直接$.方法名()
	var res = $.div(3,4);
	console.info(sum);
	console.info(res);
	
});

有空也要看看 Jquery 源码了 毕竟 JS的世界博大精深 Js最近也是火爆  或许未来真的会被Js统治把......