（1）html代码的生成，由于页码可能太多，需要隐藏部分页码，所以我们要生成一个省略号表示被隐藏的页码，通过maxButtonCount来表示最多的页码按钮
（2）事件绑定，每次页码改变都会重新生成html，我们采用事件代理的方式，提高了性能，也不用重复绑定事件
这样一个最基本的分页插件已经可以了。
但是这样足够了吗？
假设我们需要支持输入页码直接跳转的功能，那该如何呢，是否需要修改原有的html结构和css？前面我们说到，开发一个插件要围绕最基本的需求开始，那对于这些潜在的可能存在的需求又该如何处理呢。
我的解决方案是这样的，提供简单的api，不提供UI，完全由用户自定义。
我们在上面的代码增加三个api：getPageIndex，setPageIndex和setItemCount，分别表示获取当前索引，设置当前索引，设置项目总数量。代码如下：
getPageIndex: function () { return this.options.pageIndex; }, setPageIndex: function (pageIndex) { this.options.pageIndex = pageIndex; this.renderHtml(); }, setItemCount: function (itemCount) { this.options.pageIndex = 0; this.options.itemCount = itemCount; this.renderHtml(); }
提供了这三个api，假设用户需要跳转页码的功能，可以直接使用setPageIndex方法来跳转，UI完全由用户自定义，插件本身只专注基本功能，不干涉其它。
大家可以查看DEMO
整个插件的代码已经放在我的github上，有兴趣的同学可以点击查看github
总结
最后，我整理一下我开发一些js插件的思路：
1、专注最基本的需求本身，暂时不考虑可能潜在的需求
2、尽量不提供或少提供UI，减少对使用者的限制
3、考虑可能潜在的需求，提供api，潜在的需求完全由用户自定义
这是我在编写js插件时，考虑如何轻量化并且适用性强的一些想法，欢迎大家交流！
您可能感兴趣的文章: