知识点
插件的种类
插件编写的目的是给已经有的一系列方法或函数做一个封装，以便在其他地方重复使用，方便后期维护。
JQuery除了提供一个简单、有效的方式进行管理元素以及脚本，它还提供了另外一种机制，即给核心模块增加自己的方法和额外的功能。通过这种机制，Jquery允许自定义插件，提高开发效率。
JQuery的插件分为3种类型。
1.封装对象方法的插件
这种方式是对象级别的开发，将对象方法封装起来，用于对通过选择器获取的Jquery对象进行操作，是最常见的一种插件。
2.封装全局函数的插件
它是类级别的开发，可以把独立的函数添加到JQuery命名空间之下。
3.选择器插件
特殊情况下，会需要用到选择器插件。虽然Jquery的选择器十分强大，但还是会需要扩充一些自己喜欢的选择器。
插件的注意事项
（1）插件的推荐命名方法为：jquery.[插件名].js
（2）所有的对象方法都应当附加到jQuery.fn对象上面，而所有的全局函数都应当附加到JQuery对象本身上。
（3）在插件内部，this指向的是当前通过选择器获取的JQuery对象，而不像一般方法那样，内部的this指向的是DOM元素。
（4）可以通过this.each 来遍历所有的元素
（5）所有方法或函数插件，都应当以分号结尾，否则压缩的时候可能会出现问题。为了更加保险写，可以在插件头部添加一个分号（；），以免他们的不规范代码给插件带来影响。
（6）插件应该返回一个jQuery对象，以便保证插件的可链式操作。
（7）避免在插件内部使用$作为jQuery对象的别名，而应当使用完整的jQuery来表示。这样可以避免冲突。
jQuery插件的机制
jQuery提供了两个用于扩展jQuery功能方法，即jQuery.fn.extend()方法和jQuery.extend()方法。前者用于扩展前面提到的3种类型插件中的第一种，后者用于扩展后两种插件。这两个方法都接受一个参数，类型为Object。Object对象的“名/值对”分别代表“函数或方法名/函数主体”。
命名空间
在jQuery命名空间中，我们禁止使用了大量的javaScript函数名和变量名。但是仍然不可避免某些函数或变量名将于其他jQuery插件冲突，因此我们习惯将一些方法封装到另一个自定义的命名空间。
编写表格隔行变色插件
任务描述
编写表格隔行变色插件，并应用插件实现表格隔行变色，如图所示。
任务分析
使用自定义的表格隔行变色插件实现表格隔行变色，可以采用以下步骤：
1.完成静态页面设计，建立表格。
2.引入jQuery库。
3.编写插件。
4.应用插件。
任务实现
1.建立HTML页面
代码如下：
<tableid="table1">
<thead><tr><th> </th><th>学号</th><th>姓名</th><th>性别</th></tr></thead>
<tbody>
<tr>
<td><inputtype="checkbox" name="choice"value=""/></td>
<td>20141201</td>
<td>陈毅炫</td>
<td>男</td>
</tr>
……省略类似tr代码
<tr>
<td><inputtype="checkbox" name="choice" value=""checked="checked" /></td>
<td>20141206</td>
<td>黄小桂</td>
<td>女</td>
</tr>
</tbody>
</table>
2.引入jQuery库
包含jQuery的库文件，代码如下：
<scripttype="text/javascript"src="js/jquery-1.6.2.min.js"></script>
3.插件编写
代码如下：
;(function($) {
$.fn.extend({
"alterBgColor":function(options){
//设置默认值
options=$.extend({
odd:"odd", /* 偶数行样式*/
even:"even", /* 奇数行样式*/
selected:"selected" /* 选中行样式*/
},options);
$("tbody>tr:odd",this).addClass(options.odd);
$("tbody>tr:even",this).addClass(options.even);
$('tbody>tr',this).click(function() {
//判断当前是否选中
varhasSelected=$(this).hasClass(options.selected);
/如果选中，则移出selected类，否则就加上selected类
$(this)[hasSelected?"removeClass":"addClass"](options.selected)
//查找内部的checkbox,设置对应的属性。
find(':checkbox').attr('checked',!hasSelected);
});
// 如果单选框默认情况下是选择的，则高色.
$('tbody>tr:has(:checked)',this).addClass(options.selected);
return this; //返回this，使方法可链。
}
});
})(jQuery);
4.插件应用
$(function(){
$("#table1")
alterBgColor() //应用插件
.find("th").css("color","red");//可以链式操作
})
