javascript - 自动将名称 ="blah"标签添加到 <tr> 中的第 n 个 <td>

Question

我有一个页面有很多 <tr>每个包含多个 <td> .

我想为每个 <td> 自动添加 name="blah"标签通过 CSS 或 JavaScript 在行中。

所以实际上，每个 <td>将从:

<tr>
<td>Col 1 Text</td>
<td>Col 2 Text</td>
<td>Col 3 Text</td>
</tr>

收件人:

<tr>
<td name="col1">Col 1 Text</td>
<td name="col2">Col 2 Text</td>
<td name="col3">Col 3 Text</td>
</tr>

我需要这样做，因为我有一些 JavaScript 根据内容格式化单元格，并通过 <td> 搜索单元格姓名。

有什么办法可以实现吗？谢谢。

Answer 1

使用setAttribute()

var tds = document.querySelectorAll('td');

for (var i = 0; i < tds.length; i++) {
  tds[i].setAttribute('name', 'col' + (i + 1));
}

td[name]{
  background:green;
  }

<table>
  <tr>
    <td>Col 1 Text</td>
    <td>Col 2 Text</td>
    <td>Col 3 Text</td>
  </tr>
</table>