原生js之分页算法

var data=[

    '标题1',

    '标题2',

    '标题3',

    '标题4',

    '标题5',

    '标题3',

    '标题4',

    '标题5'

];

showList(1);

function showList(page) {

    //分页要素

    var total=data.length;//获取长度

    var perpage=3;//每页长度

    var totalpage=Math.ceil(total/perpage);//第几页

    //分页算法

    var start=(page-1)*perpage;//0

    var end=start+perpage;//3

var  pageData=data.slice(start,end);

//列表

    var  listTemp='';

    pageData.forEach(function (item,index) {

        listTemp+='<li>'+index+'' +

            '*****'

            +item+'---' +

            '<button style="background-color: brown ;color: white" onclick="delItem('+item+')">删除</button></li>';

    });

    document.getElementById('list').innerHTML=listTemp;

    //分页模板

    var pageTemp='';

    for (var p=1;p<=totalpage;p++){

        var active=(p==page?'active':'');

        pageTemp+="<button class='"+active+"' onclick='showList("+p+")'>"+p+"</button>"

    }

    document.getElementById('pager').innerHTML=pageTemp;

}

————————————写的不好，仅供参考