DIV CSS 佈局教程網

一. 先對jQuery制作方式，jQuery為開發擴展提拱了兩個方法，分別是：
jQuery.extend(object); 為擴展jQuery類本身.為類添加新的方法。
jQuery.fn.extend(object);給jQuery對象添加方法。
1.1、jQuery.fn.extend(object):
可以參靠jquery參考手冊的連個例子：
代碼如下:
$.fn.extend({
check: function() {
return this.each(function() { this.checked = true; });
},
uncheck: function() {
return this.each(function() { this.checked = false; });
}
});

使用：
代碼如下:
$("input[type=checkbox]").check();
$("input[type=radio]").uncheck();

1.2、jQueryjQuery.extend(object)
擴展jQuery對象本身。用來在jQuery命名空間上增加新函數。
jQuery 代碼:
代碼如下:
$.extend({
min: function(a, b) { return a < b ? a : b; },
max: function(a, b) { return a > b ? a : b; }
});

使用：
代碼如下:
$.min(2,3); // => 2
$.max(4,5); // => 5

二、tableUI具體的插件示例代碼如下：
代碼如下:
/*
* tableUI 0.2
* 就不寫版權了吧，呵呵
* Date: 4/1/2010
* 使用tableUI可以方便地將表格提示使用體驗。先提供的功能有奇偶行顏色交替，鼠標移上高亮顯示
* 0.2版結合25個小貼士對“政委”的那個做了些優化，學習之用，還請指正。
*/
(function($) {
$.fn.tableUI = function(options) {
//默認參數
var defaults = {
evenRowClass: "evenRow",
oddRowClass: "oddRow",
activeRowClass: "activeRow"
};
//用傳入參數覆蓋了默認值
options = $.extend(defaults, options);
//表對象
var thisTable = $(this);
//添加奇偶行顏色
thisTable.find("tr:even").addClass(options.evenRowClass);
thisTable.find("tr:odd").addClass(options.oddRowClass);
//綁定鼠標移動事件，不必對每行都綁定事件。
thisTable.live("mouseover", function(e) {
//獲取鼠標所指目標對象父級tr
$(e.target).parent().addClass(options.activeRowClass);
//阻止事件冒泡
return false;
}).live("mouseout", function(e) {
$(e.target).parent().removeClass(options.activeRowClass);
return false;
});
};
})(jQuery);