javascript - Bolehkah JS mengubah suai elemen jadual menggunakan operasi DOM?

Question

Apa yang saya ingin capai ialah memadam separuh kedua jadual di bawah secara terus menggunakan JS.
Tetapi saya tidak tahu bagaimana untuk memanggilnya.
Iaitu bermula dari kedudukan <h2>2017</h2>
Bagaimana untuk memadam elemen DOM menggunakan JS?

    <table cellpadding="0" cellspacing="0" style="word-wrap: break-word;">
        <colgroup class="__web-inspector-hide-shortcut__">
            <col width="10px">
            <col width="49px">
            <col width="10px">
            <col width="88px">
            <col width="49px">
            <col width="49px">
            <col width="49px">
            <col width="49px">
            <col width="49px">
            <col width="49px">
            <col width="49px">
            <col width="49px">
            <col width="49px">
            <col width="49px">
            <col width="49px">
            <col width="49px">
            <col width="49px">
            <col width="49px">
        </colgroup>
        <tbody style="text-align:center;">
            <tr>
                
            </tr>
            <tr>
                <td colspan="19" align="center" style="border:none;">
                    <h2><span ng-bind="compare_year" class="ng-binding">2016</span>年度</h2>
                </td>
            </tr>
            <tr class="">
                <td class="top">
                    序号
                </td>
                <td class="top">
                    A1<br>姓名
                </td>
                <td class="top">
                    A2<br>性别
                </td>
                <td class="top" colspan="3">
                    A3<br>证件号码
                </td>
                <td class="top">
                    A4<br>与户主关系
                </td>
                <td class="top">
                    A5<br>民族
                </td>
                <td class="top">
                    A6<br>政治面貌
                </td>                
                <td class="top">
                    A7<br>文化程度
                </td>            
                <td class="top">
                    A8<br>在校生情况
                </td>
                <td class="top">
                    A9<br>健康状况
                </td>
                <td class="top">
                    A10<br>劳动技能
                </td>
                <td class="top">
                    A11<br>务工情况
                </td>
                <td class="top">
                    A12<br>务工时间(单位:月)
                </td>
                <td class="top">
                    A13<br>是否现役军人
                </td>
                <td class="top right">
                    A14<br>是否参加大病医疗保险
                </td>
            </tr>
            <!-- <tr ng-repeat="row in AB01.rowSet.primary"> -->
            
            <!-- ngRepeat: cell in row.AB01 --><tr ng-repeat="cell in row.AB01" class="ng-scope">
            
                <td ng-bind="$index+1" class="ng-binding">1</td>
                <td ng-bind="cell.data.AAB002" class="ng-binding">王秀梅</td>
                <td ng-bind="cell.data.AAB003" class="ng-binding">女</td>
                <td colspan="3" ng-bind="cell.data.AAB004" class="ng-binding">37250*81766</td>
                <td ng-bind="cell.data.AAB006" class="ng-binding">户主</td>
                <td ng-bind="cell.data.AAB007" class="ng-binding">汉族</td>
                <td ng-bind="cell.data.AAK033" class="ng-binding">群众</td>
                <td ng-bind="cell.data.AAB008" class="ng-binding">文盲或半文盲</td>                
                <td ng-bind="cell.data.AAB009" class="ng-binding">非在校生</td>
                <td ng-bind="cell.data.AAB017" class="ng-binding">长期慢性病</td>
                <td ng-bind="cell.data.AAB010" class="ng-binding">无劳动力</td>
                <td ng-bind="cell.data.AAB011" class="ng-binding">其他</td>
                <td ng-bind="cell.data.AAB012" class="ng-binding">0</td>
                <td ng-bind="cell.data.AAB019" class="ng-binding">否</td>
                <td class="right ng-binding" ng-bind="cell.data.AAB022"></td>
            </tr><!-- end ngRepeat: cell in row.AB01 -->
            <tr>
                <td colspan="19" align="center" style="border:none;">
                    <h2>2017年度</h2>
                </td>
            </tr>
            <tr>
                <td class="top">
                    序号
                </td>
                <td class="top">
                    A1<br>姓名
                </td>
                <td class="top">
                    A2<br>性别
                </td>
                <td class="top" colspan="3">
                    A3<br>证件号码
                </td>
                <td class="top">
                    A4<br>与户主关系
                </td>
                <td class="top">
                    A5<br>民族
                </td>
                
                <td class="top">
                    A6<br>政治面貌
                </td>
                
                <td class="top">
                    A7<br>文化程度
                </td>
                
                <td class="top">
                    A8<br>在校生情况
                </td>
                <td class="top">
                    A9<br>健康状况
                </td>
                <td class="top">
                    A10<br>劳动技能
                </td>
                <td class="top">
                    A11<br>务工地点
                </td>
                <td class="top">
                    A12<br>务工时间(单位:月)            
                </td>
                <td class="top">
                    A13<br>是否现役军人
                </td>
                <td class="top">
                    A14<br>是否参加大病医疗保险            
                </td>
                <td class="top">
                    A15<br>是否享受低保
                </td>
                <td class="top">
                    A50<br>务工企业名称
                </td>
                <td class="top right">
                    联系电话
                </td>                        
            </tr>
            <tr>
                <td>1</td>
                <td></td>
                <td></td>
                <td colspan="3"></td>
                <td>户主</td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                
                <td class="right"></td>
            </tr>
            <tr>
                <td>2</td>
                <td></td>
                <td></td>
                <td colspan="3"></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                
                <td class="right"></td>
            </tr>
            <tr>
                <td>3</td>
                <td></td>
                <td></td>
                <td colspan="3"></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td class="right"></td>
            </tr>
            <tr>
                <td>4</td>
                <td></td>
                <td></td>
                <td colspan="3"></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td class="right"></td>
            </tr>
            <tr>
                <td>5</td>
                <td></td>
                <td></td>
                <td colspan="3"></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td class="right"></td>
            </tr>
            <tr>
                <td>6</td>
                <td></td>
                <td></td>
                <td colspan="3"></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td class="right"></td>
            </tr>
        </tbody>

Answer 1

Mengapa tidak mengekstraknya secara berasingan dan menulis "2017" ke dalam jadual secara berasingan?
Jika anda mesti melakukan ini, anda boleh:

1. Tambahkan atribut nama (seperti name="special-tr-group") pada semua tr peringkat pertama yang anda ingin sembunyikan
   seperti berikut:

<tr name="special-tr-group">
    <td colspan="19" align="center" style="border:none;">
        <h2>2017年度</h2>
    </td>
</tr>
<tr name="special-tr-group">
    <td class="top">
        序号
    </td>
    <td class="top">
        A1<br>姓名
    </td>
    <td class="top">
        A2<br>性别
    </td>
    ...
    ...
</tr>
...
...

1. Kemudian tambahkan id pada badan anda:

<tbody style="text-align:center;" id="tbody-year">

1. Akhir sekali, selepas DOM anda dimuatkan, pelaksanaan JS:

var tBody = document.getElementById("tbody-year");    //表格中的tbody节点
console.log(tBody);
var trGroup = document.getElementsByName("special-tr-group");    //要删除的节点
for (var i=0; i < trGroup.length; i++) {
    tBody.removeChild(trGroup[i]);
}