表格合并同类项

1.表格合并同类项

  /**
    * 渲染表格
    * */
    function setInputTable(index, id, data) {
        //循环渲染表格
        var tableInputFactDom; //表格的行数 第几个条形图
        for (var k = 0; k < data.length; k++) {
            tableInputFactDom = getTRFactTableObj(k, data);
            $("#" + id).append(tableInputFactDom);
        }

        if (data.length>6){
            var MyMarhq = '';
            // $('.tbl-body' + index + ' tbody').html($('.tbl-body' + index + ' tbody').html() + $('.tbl-body' + index + ' tbody').html());
            $('.tbl-body' + index + '').css('top', '0');
            var tblTop = 0;
            var speedhq = 50; // 数值越大越慢
            var outerHeight = $('.tbl-body' + index + ' tbody').find("tr").outerHeight();

            function Marqueehq() {
                if (tblTop <= -outerHeight * data.length) {
                    tblTop = 0;
                } else {
                    tblTop -= 1;
                }
                $('.tbl-body' + index + '').css('top', tblTop + 'px');
            }

            MyMarhq = setInterval(Marqueehq, speedhq);

            // 鼠标移上去取消事件
            $('.tbl-body' + index + ' tbody').hover(function() {
                clearInterval(MyMarhq);
            }, function() {
                clearInterval(MyMarhq);
                MyMarhq = setInterval(Marqueehq, speedhq);
            })
        }

        uniteTdCells('my-table' + index)
    }

    //合并第一列相同的
    function  uniteTdCells(tableId) {
        var table = document.getElementById(tableId);
        for (let i = 0; i < table.rows.length; i++) {
            for (let c = 0; c < table.rows[i].cells.length; c++) {
                if (c == 0 ) { //选择要合并的列序数，去掉默认全部合并
                    for (let j = i + 1; j < table.rows.length; j++) {
                        let cell1 = table.rows[i].cells[c].innerHTML;
                        let cell2 = table.rows[j].cells[c].innerHTML;
                        if (cell1 == cell2) {
                            table.rows[j].cells[c].style.display = 'none';
                            table.rows[j].cells[c].style.verticalAlign = 'middle';
                            table.rows[i].cells[c].rowSpan++;
                        } else {
                            table.rows[j].cells[c].style.verticalAlign = 'middle'; //合并后剩余项内容自动居中
                            break;
                        };
                    }
                }
            }
        }
    }

2.表格实现效果