最近要到使用别的jquery插件，但部分功能并不能满足，为满足功能，只能对插件进行修改来满足，要修改插件，先要了解插件如何封装，
明白了如何封装插件，才能更好修改插件；
如何封装插件？
1、插件封装类型：
①封装对象类；②封装全局函数型；③选择器插件类；
2、关于封装插件的建议
①封装的插件建议为jquery.[插件名].js,避免和其他插件混淆；
②插件开头，尽量加上分号，避免别人的代码不规范引起错误，插件结尾都应该加上分号，避免压缩出错；
③插件应该设置默认参数，增加插件可用性；
例如
;(function($){
//此处编写插件代码
})(jQuery);
此处贴代码：
;(function($){
//1.初始化,拼接html
//2.为元素添加事件
$.fn.extend({
'pic':function(){
var $this=this;
var vs=$(this).find("li").length;
var html="<div class="box"><ul>";
for (var i = 0; i < vs; i++) {
if(i==0){
html+="<li class="active"><a href="javascript:void(0);" class="page">"+(i*1+1)+"</a></li>";
}else{
html+="<li><a href="javascript:void(0);" class="page">"+(i*1+1)+"</a></li>";
}
};
html+="</ul></div>";
$(this).parent().append(html);
$(".box li").click(function(){
$(this).addClass("active");
$(this).siblings().removeClass("active");
$($this).find("li").eq($(this).text()*1-1).show();
$($this).find("li").eq($(this).text()*1-1).siblings().hide();
});
}
});
})(jQuery);
此代码为一个简单的图片轮播插件，效果图如：
在此附上页面代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>图片显示</title>
<link rel="stylesheet" type="text/css" href="jquery.pictrue.css">
</head>
<body>
<div class="container">
<ul class="picture" id="pc">
<li><img alt="1" src="imgs/03.jpg"></li>
<li><img alt="1" src="imgs/04.jpg"></li>
<li><img alt="1" src="imgs/05.jpg"></li>
</ul>
</div>
</body>
<script type="text/javascript" src="jquery-1.10.2.js"></script>
<script type="text/javascript" src="jquery.picture.js"></script>
<script type="text/javascript">
$(function(){
$("#pc").pic();
});
</script>
</html>