HTML填表头，JS填tbody，并滚动

<div class="data-column" height="33%" style="background-color: #0d2840;width: 100%;height: 100%;border-radius: 10px;border: 1px #0174f5 solid;padding: 1px;box-sizing: border-box;">
            <div style="width: 100%;height: 100%;box-sizing: border-box;border:2px solid #016ae0;border-radius: 10px;">
                <div class="data-title" th:style="'background-image:url(' +@{/css/console/images/monitor/second_title.png} + ');background-size:100% 100%;height:10%;background-repeat: no-repeat;margin:0 30%;'">
                    <span><i class="fa fa-line-chart" aria-hidden="true" style="padding-left: 21%;padding-top:3%;font-size: medium;">&nbsp;乡镇概览</i></span>
                </div>
                <div class="data-content">
<!--                                <div class="box9-1 data-content" style="margin-top: 4%">-->
                                    <table class="table "style="color: #83c7e3;margin-bottom:0px" >
                                        <thead>
                                        <tr style="font-size: 14px; color: #83c7e3;width:100%">
<!--                                            <th style="border:none;width:10%"></th>-->
                                            <th style="border:none;width: 32%">乡镇名称</th>
                                            <th style="border:none;width: 17%">企业数量</th>
                                            <th style="border:none;width: 17%">环保违规</th>
                                            <th style="border:none;width: 17%">生产违规</th>
                                            <th style="border:none;width: 17%">排放违规</th>
                                        </tr>
                                        </thead>
                                    </table>
                                    <div class="boxscrolls" style="overflow: hidden;height: 85%">
                                        <table id="table3" class="table" style="color:#83c7e3">
                                            <tbody style="font-size: 13px;border-color: #0e2e48;" id="facEmi"></tbody>
                                            <tbody class="tablescroll0" style="font-size: 13px;border-color: #0e2e48;"></tbody> 这段不能少，因为会导致循环会停在列表结束的位置                                       </table>
                                    </div>
                                </div>
<!--                </div>-->
            </div>
        </div>

initJPDetail:function(){
            var me =this;
            // var url = __ctx+"/platform/home/getFataDataList";
            var url=__ctx+"/platform/home/getTownList";
            $.post(url,function(result){
                me.factoryList=result;
                var facEmi=$("#facEmi");
                facEmi.empty();
                var facEmiTr="";
                var points =[];
                $(result).each(function () {
                    var fact=this;
                    var point=new Map();
                    // point.lng=fact.lng;
                    // point.lat=fact.lat;
                    point.count=Math.random()*10000;
                    points.push(point)
                    var trA = '<tr>' +
                        // '<td style="border:none;width:5%;" ><p class="round" style="background:#42E98B"></p></td>' +
                        '<td style="width:32%;border: none;">'+fact.name+'</td>' +
                        '<td style="width:17%;border: none;">'+(Math.random()*100).toFixed(2)+'</td>' +
                        '<td style="width:17%;border: none;">'+(Math.random()*100).toFixed(2)+'</td>' +
                        '<td style="width:17%;border: none;">'+(Math.random()*100).toFixed(2)+'</td>' +
                        '<td style="width:17%;border: none;">'+(Math.random()*100).toFixed(2)+'</td>' +
                        // '<td style="width:20%;border: none;">'+'达标'+'</td>' +
                        '</tr>';
                    facEmiTr+=trA;
                })
                facEmi.append(facEmiTr);
                var gradient = {0.2:'#0928a6',0.4:'#06d7ff',0.6:'#36ff27',0.8:'#d9f108',0.9:'#E7FF08'};
                var heatmapOverlay = new BMapLib.HeatmapOverlay({"radius":50});
                me.map.addOverlay(heatmapOverlay);
                heatmapOverlay.setDataSet({data:points,max:10000});
                heatmapOverlay.setOptions({"gradient":gradient});
                heatmapOverlay.show();
                for(var i=0;i<me.timers.length;i++){
                    window.clearInterval(me.timers[i]);
                }
                me.initBoxsscrolls();
            })
        },

initBoxsscrolls:function(){
            var me=this;
            var speed = [100,100];		//不同模块的滚动速度，值越大滚动越慢
            var boxes = $('.boxscrolls');
            boxes.each(function(i) {
                var box = $(this);
                var table = $(this).find("tbody").length?$(this).find("tbody").first():$(this)
                if(table.height() >= box.height()){
                    $(this).find(".tablescroll0").html(table.html());
                    var h1=box.scrollTop(),h2 = table.innerHeight();
                    function Marquee() {
                        if(me.scrollFlag[i]){
                            if (h1 >= h2) {
                                box.scrollTop(0);
                                h1=box.scrollTop();
                            } else {
                                box.scrollTop(++h1);
                            }
                        }
                    }
                    me.timers[i] = setInterval(Marquee, me.speed[i]);
                    box.mouseover(function(){
                        me.scrollFlag[i]=false;
                    });
                    box.mouseout(function(){
                        me.scrollFlag[i]=true;
                    });
                }
            });
        },