首页 > 解决方案 > 如何根据 th 更新 td?

问题描述

我有一个具有以下结构的 HTML 表

<thead>
                        <tr>
                            <th>COMPANY</th>
                            <th>DATE</th>
                            <th>SHARE</th>
                            <th>COST PRICE</th>                                 
                        </tr>                
</thead>

在数据部分,我有以下结构。

<tr>
                            <td rowspan="2">COMPANY1</td>
                            <td>DATE1</td>
                            <td>SHARE1</td>
                            <td>COST PRICE1</td>                                 
</tr> 

当我尝试<td>从 jquery 动态更新表中的 s 时,我需要添加一些逻辑来检查第一个元素是否跨越多行。我想问我们是否可以根据标题更新行,比如关联数组。

像这个伪代码$(this).td[<WHERE th=SHARE>].text("something)

标签: javascriptjqueryhtml

解决方案


我建议您<td>在准备 html 标记时应指定 sa 类名,如下所示:

<tr>
  <td class="company" rowspan="2">COMPANY1</td>
  <td class="date">DATE1</td>
  <td class="share">SHARE1</td>
  <td class="cost-price">COST PRICE1</td>                                 
</tr>
<tr>
  <td class="date">DATE1</td>
  <td class="share">SHARE1</td>
  <td class="cost-price">COST PRICE1</td>                                 
</tr>

Javascript 将是这样的:

$('tr').each(function() {
  $(this).children('td.share').text('Share...');
  $(this).children('td.cost-price').text('Cost Price...');
});

推荐阅读