参考：https://www.cnblogs.com/Renyi-Fan/p/9131081.html

点击标题1即可生成表格的数据，再次点击进行隐藏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>演示文档</title>
    <style type="text/css">
    </style>
</head>
<body>
    <table id="tab" border="1" width="300">
    <caption>表格名称</caption>
    <thead>
        <tr>
            <th colspan="3" onclick="hideTab()">标题1</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>单元格11</td>
            <td>单元格12</td>
            <td>单元格13</td>
        </tr>
        <tr>
            <td>单元格21</td>
            <td>单元格22</td>
            <td>单元格23</td>
        </tr>
        <tr>
            <td>单元格31</td>
            <td>单元格32</td>
            <td>单元格33</td>
        </tr>
        </tbody>
        <tfoot><td>备注：</td><td colspan="2"></td></tfoot>
    </table>
    <script>
    var isHide=false;
    function hideTab(){
        var tab=document.getElementById('tab')
        var rows=tab.rows;
        var len=tab.rows.length;
        // tab.style.display='';
        for(var i=1;i < len;i++){
            if (isHide) {
                rows[i].style.display='';
            }else{
                rows[i].style.display='none';
            }
        }
        isHide=!isHide
    }

    </script>
</body>
</html>