最近公司需要用到分页插件，由于市面上大多都是jQuery的分页插件，而且项目中有自己的工具类，所以说我在工具类中又添加了不依赖jQuery的分页插件，而且分页插件来说对DOM的操作也不是很多，就是用JS来操作DOM还有有一点点蛋疼的，起码代码看上去不是特别的简洁美观。

　　　下面是插件的使用方法，这个是JS代码：

1             pageUtil.initPage('page',{ 2                 totalCount:500,//总页数，一般从回调函数中获取。如果没有数据则默认为1页 3                 curPage:1,//初始化时的默认选中页，默认第一页。如果所填范围溢出或者非数字或者数字字符串，则默认第一页 4                 showCount:9,//分页栏显示的数量 5                 pageSizeList:[5,10,15,20,25,30],//自定义分页数，默认[5,10,15,20,50] 6                 defaultPageSize:10,//默认选中的分页数,默认选中第一个。如果未匹配到数组或者默认数组中，则也为第一个 7                 isJump:true,//是否包含跳转功能，默认false 8                 isPageNum:true,//是否显示分页下拉选择，默认false 9                 isPN:true,//是否显示上一页和下一面，默认true10                 isFL:true,//是否显示首页和末页，默认true11                 jump:function(curPage,pageSize){
   //跳转功能回调，传递回来2个参数，当前页和每页大小。如果没有设置分页下拉，则第二个参数永远为0。这里的this被指定为一个空对象，如果回调中需用到this请自行使用bind方法12                     console.log(curPage,pageSize);13                 },14             });

　　　下面是html代码,page就是对应的id，如果不需要调整居中什么的话，就直接使用最简单的div就行了:

1         
     
      2             
      
3         
     

　　下面就是效果图：

　　

 

　　这里基于简单的概念，所以我把样式都设置成了内联，如果需要更改颜色或者其他的样式，可能需要在js中更改或者使用Important强制覆盖，但是一般只需改一个颜色就行了，也不是特别的麻烦。

 　　具体代码怎么实现这里就不发了，有兴趣的同学可以下载代码看一下，这里是下载地址：http://pan.baidu.com/s/1mitDfnU，代码写的不好请勿喷····