上一页，下一页渲染页面

##上一页，下一页渲染页面
首先是html：

<div id="pageNum">
        <button>1</button>
        <button>1</button>  
    </div>
    <button onclick="first()">首页</button>
    <button onclick="perv()">上一页</button>
    <button onclick="next()">下一页</button>
    <button onclick="last()">末页</button>
    <ul id="ul"></ul>
    <p>
        共:<span id="pageSum"></span>页
        当前:<span id="page"></span>页
    </p>
    <button>下一页</button>

下面是js：

 <script>
        var arr=[
            "a","b",
            "c","d",
            "e","f",
            "g","h",
        ];
        var page=1;//页数
        var limit=2//每页显示条数
        function perv(){
            if(page>1){
                page-=1;
                var nowArr=arr.slice((page-1)*limit,page*limit)
                console.log(nowArr)
            }else{
                alert("这是首页")
            }
        }
    //这是下一页
        function next(){
            if(page<Math.ceil(arr.length/limit)){//页数
                page+=1;
                var nowArr=arr.slice((page-1)*limit,page*limit);
                console.log(nowArr)
            }else{
                alert("这是最后一页")
            }
        }
    //这是第一页
    function first(){
        page=1;
        var nowArr=arr.slice((page-1)*limit,page*limit);
        console.log(nowArr)
    }
    //这是最后一页
    function last(){
        page=Math.ceil(arr.length/limit);
        var nowArr=arr.slice((page-1)*limit,page*limit);
        console.log(nowArr)
    }

    window.onload=function(){
        var nowArr=arr.slice((page-1)*limit,page*limit);
        console.log(nowArr);


        var sum=Math.ceil(arr.length/limit);
        var str=""
        for(var i=1;i<=sum;i++){
            str+=`
            <button οnclick="numPage(${i})">${i}</button>
            `
        }
        document.getElementById("pageNum").innerHTML=str;
    }


    //点数字 1 2 3 页
    function numPage(i){
        page=i;
        var nowArr=arr.slice((page-1)*limit,page*limit);
        console.log(nowArr);
    }

    function showli(arr){
        var str="";
        for(let i=0;i<arr.length;i++){
            str+=`
            <li>${arr[i]}</li>
        `
        }
        document.getElementById("ul").innerHTML=str;
    }

    function pageSum(){
        return Math.ceil(arr.length/limit);
    }

    //当前第几页
    function nowPage(page){
        document.getElementById("page").innerText=page;
    }
    document.getElementById("pageSum").innerText=pageSum();
    </script>