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" } )
网友评论