$.extend()与$.fn.extend()

jQuery是一个很丰富的javascript库，说到库，自然就想到了框架，那么库和框架有什么区别呢？

1，库是对各种方法的封装，我们直接调用方法即可使用；

2，框架提供了代码的书写规则，我们按照这些规则去书写代码，框架就会帮我们实现相应的功能，所以框架要更加强大。

虽然jQuery提供了很多的方法，但是不可能满足我们所有的需求；下面来说一下jQuery扩展方法的实现：

首先说$.extend() : 它是对 jQuery本身 的方法拓展

(1) $.extend( obj , obj1 ,obj2...) ------- 此处是将obj1 ,obj2 ..... 合并到obj中，合并后返回obj ;也即obj将会拥有obj1,obj2...对象的属性和方法

(2) $.extend(obj) ----- 是将obj合并到 jQuery 的全局对象中 ，所以 jQuery 的实例对象是不能继承obj的属性和方法的；

再说$.fn.extend(obj)  ----- 是将obj合并到jQuery的实例对象中，但是jQuery本身不能使用obj的属性和方法。

上面的说法还是有点不太容易理解，我用了一个比较浅显易懂的例子来说明，如果有错误，还请大神指教：

Person 构造函数 ： function  Person() {      this.name = "zs" ; this.age = 18 ;   } 

实例化对象 ：var p = new Person() ;

i : 给构造函数添加属性和方法 ：Person.say = function() {  alert(1)   };

    然后让 p 调用此方法 ： p.say() ------  最终的结果会报错，所以p无法继承Person的扩展方法say;

此处相当于 $.extend() 扩展方法

ii : 给实例化对象添加属性和方法： p.eat = function() {  alert(2)   };

   然后让 Person 调用此方法： Person.eat()  ----- 同样会报错，Person构造函数无法使用实例化对象p 扩展的方法eat ，此处相当于$.fn.extend()扩展方法

在实际的工作中，我们使用$.fn.extend()方法较多，因为这是给 $的原型拓展的方法，$实例对象可以继承原型中所有的属性和方法。

下面讲一个用$.fn.extend()方法实现 页面中调用 $(dom).fn.color ( { "color" : "blue" } )即可实现给dom元素添加颜色：

$.fn.color = function( option ) {

var styleObj = $.extend({ },{ "color" : "red" } , option ) -----// 将option(我们调用时传递的样式对象） 和默认样式{ "color" : "red" }合并到一个空对象中并返回给到styleObj；如果没有传参，采用默认样式。

$(this).css ( styleObj );

}

$(dom).fn.color( { "color" : "blue" } )