$.extend(object) 可以理解為jquery添加壹個靜態方法
$.fn.extend(object) 可以理解為jquery實例添加壹個方法
$.extend(object)
例子：
/* $.extend 定義與調用
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
$.extend({ fun1: function () { alert("執行方法壹"); } });//定義
$.fun1();//調用
$.fn.extentd(object)
/* $.fn.extend 定義與調用
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
$.fn.extend({ fun2: function () { alert("執行方法2"); } });
$(this).fun2();
//等同於
$.fn.fun3 = function () { alert("執行方法三"); }
$(this).fun3();
定義jquery插件的基本結構
1． 定義作用域：
為插件定義壹個私有作用域。外界代碼不能直接訪問插件內部。插件內部代碼不受外界幹擾，也不會汙染到全局變量。
//step01 定義JQuery的作用域
(function ($) {
})(jQuery);
2. 為插件添加擴展方法：
復制代碼
//step01 定義JQuery的作用域
(function ($) {
//step02 插件的擴展方法名稱
$.fn.easySlider = function (options) {
}
})(jQuery);
復制代碼
3. 設置默認值：
//step01 定義JQuery的作用域
(function ($) {
//step03-a 插件的默認值屬性
var defaults = {
prevId: 'prevBtn',
prevText: 'Previous',
nextId: 'nextBtn',
nextText: 'Next'
//……
};
//step02 插件的擴展方法名稱
$.fn.easySlider = function (options) {
//step03-b 合並用戶自定義屬性，默認屬性
var options = $.extend(defaults, options);
}
})(jQuery);
其中：var options = $.extend(defaults, options)的含義了。表示 options 去覆蓋了defaults的值，並把值賦給了options。
在插件環境中，就表示用戶設置的值，覆蓋了插件的默認值；如果用戶沒有設置默認值的屬性，還是保留插件的默認值。
4. 支持jquery選擇器：
//step01 定義JQuery的作用域
(function ($) {
//step03-a 插件的默認值屬性
var defaults = {
prevId: 'prevBtn',
prevText: 'Previous',
nextId: 'nextBtn',
nextText: 'Next'
//……
};
//step02 插件的擴展方法名稱
$.fn.easySlider = function (options) {
//step03-b 合並用戶自定義屬性，默認屬性
var options = $.extend(defaults, options);
//step4 支持JQuery選擇器
this.each(function () {
});
}
})(jQuery);
5 ．支持JQuery的鏈接調用：
為了能達到鏈接調用的效果必須要把循環的每個元素return
//step01 定義JQuery的作用域
(function ($) {
//step03-a 插件的默認值屬性
var defaults = {
prevId: 'prevBtn',
prevText: 'Previous',
nextId: 'nextBtn',
nextText: 'Next'
//……
};
//step02 插件的擴展方法名稱
$.fn.easySlider = function (options) {
//step03-b 合並用戶自定義屬性，默認屬性
var options = $.extend(defaults, options);
//step4 支持JQuery選擇器
//step5 支持鏈式調用
return this.each(function () {
});
}
})(jQuery);
6. 插件裏的方法：
在插件裏定義的方法，外界不能直接調用，我在插件裏定義的方法也沒有汙染外界環境。
復制代碼
//step01 定義JQuery的作用域
(function ($) {
//step03-a 插件的默認值屬性
var defaults = {
prevId: 'prevBtn',
prevText: 'Previous',
nextId: 'nextBtn',
nextText: 'Next'
//……
};
//step06-a 在插件裏定義方法
var showLink = function (obj) {
$(obj).append(function () { return "(" + $(obj).attr("href") + ")" });
}
//step02 插件的擴展方法名稱
$.fn.easySlider = function (options) {
//step03-b 合並用戶自定義屬性，默認屬性
var options = $.extend(defaults, options);
//step4 支持JQuery選擇器
//step5 支持鏈式調用
return this.each(function () {
//step06-b 在插件裏定義方法
showLink(this);
});
}
})(jQuery);