Javascript 如何动态更改表头？

我想根据突出显示的行数据动态更改表头。例如，如果我们假设用户在第一列中选择了美国，那么另一列标题应更改为美国境内的州。所有国家及其对应的州都在一个键数组中，并且根据所选国家，标题和列数必须更改如下

阿拉巴马州
阿拉斯加州

这是选择“第一行第一列中的美国”时标题的外观

<tr id="1"><td>USA</td></tr>

美国

当第2行=英国时 标题应该是“莫伊尔”、“大伦敦”等等

---

我该怎么做呢？

我假设您希望用户单击要突出显示的表格数据单元格？
因为那样就很容易了。 给每个td一个在jQuery中重新查询的属性，类似于：

$('td').click(function(){
    $country = $(this).attr('country');
    $(this).addClass("highlight");
    $('tr.states').empty;
    for each item in $myarrayStates['$country']{
     $('tr.states').append("<td>"&$myarrayStates&"</td>")
    }});

$（'td'）。单击（函数（）{
$country=$（this.attr（'country'）；
$（此）.addClass（“突出显示”）；
$（'tr.states'）。空；
对于$myarrayStates[“$country]”中的每个项目{
$（'tr.states'）。追加（“&$myarrayStates&”）
}});

虽然html看起来像

<tr class="countries">
    <td country="USA">USA</td>
    <td country="UK">Great Britain</td>
    <td country="DE">Germany</td>
</tr>
<tr class="states">
    <td state="Alabama">Alabama</td>
</tr>

美国
大不列颠
德国
阿拉巴马州

那么唯一剩下的就是确保有足够的空间放桌子行，但我把这个留给你

---

如果我没有抓住要点，很抱歉，但我不太确定您希望它是什么样子：（

分享您为此所做的代码。

<tr class="countries">
    <td country="USA">USA</td>
    <td country="UK">Great Britain</td>
    <td country="DE">Germany</td>
</tr>
<tr class="states">
    <td state="Alabama">Alabama</td>
</tr>