html中div分页操作

    //栏目分页操作，js代码
    var allPages;
    var cnt;
    var indexs;
    var boxes;
    $(function() {
        var $div = $("#rdjggs");
        var $pages = $("#pages1");
        var pgindex = 1;//当前页
        var eachCnt = 8;//每页显示个数
        boxes = $("div[name='box']");
        cnt = boxes.length;
        console.log(cnt);
        indexs = new Array(cnt);
        for(var i=0; i<cnt; i++) {
            indexs[i] = i;
        }
        allPages = Math.ceil(cnt/eachCnt);


        $pages.html("共 " + allPages + " 页");
        console.log($pages);
        showPage(1);
        for(var i=0; i<allPages; i++) {
            $pages.append("<a href=\"javascript:showPage('"+ (i+1) +"');\"> "+ (i+1) +" </a>");
        }
        $pages.append("<a href=\"javascript:gotopage(-1);\">上一页</a> <a href=\"javascript:gotopage(1);\">下一页</a>");


    });

    function gotopage(value){
        try{
            value=="-1"?showPage(pgindex-1):showPage(pgindex+1);
        }catch(e){

        }
    }
    function showPage(pageIndex)
    {
        if(pageIndex== 0 || pageIndex==(allPages+1)) {
            return;
        }
        var start = (pageIndex-1)*8;//8
        //alert("start:" + start);
        var end = start + 8;
        end = end > cnt ? cnt : end;//16
        //alert("end:" + end);
        var subIndexs = indexs.slice(start, end);
        for(var i=0; i<cnt; i++) {
            if(contains(i, subIndexs)) {
                boxes.eq(i).show();
            }else{
                boxes.eq(i).hide();
            }
        }
        pgindex = pageIndex;
    }
    var contains = function (element, arr) {

        for (var i = 0; i < arr.length; i++) {
            if (arr[i] == element) {
                return true;
            }
        }
        return false;
    }
                <div>                                      //.html
                    <div class="in_news_nr" id="rdjggs">
                        <div class="in_news_list_item clear"
                        <div >
                            aa<span>2017-12-01</span>
                        </div>
                        <div >
                            bb<span>2017-12-01</span>
                        </div>
                        ...
                    </div>
                    <Div class="page clear" id="pages1" style="margin-left: 340px">

                    </Div>