首页 > 解决方案 > 如何为表格的单元格设置特定的ID

问题描述

我有一张桌子,我想为td我桌子上的每个人设置一个特定的 id。更多解释:


我有一张这样的桌子:

<table class="myTable">
  <tr class="tr">
    <td class="td"></td>
    <td class="td"></td>
    <td class="td"></td>
    <td class="td"></td>
  </tr>
  <tr class="tr">
    <td class="td"></td>
    <td class="td"></td>
    <td class="td"></td>
    <td class="td"></td>
  </tr>
</table>

我想通过 Jquery 制作这样的表格:

<table class="myTable">
  <tr class="tr">
    <td class="td" id="td1"></td>
    <td class="td" id="td2"></td>
    <td class="td" id="td3"></td>
    <td class="td" id="td4"></td>
  </tr>
  <tr class="tr">
    <td class="td" id="td5"></td>
    <td class="td" id="td6"></td>
    <td class="td" id="td7"></td>
    <td class="td" id="td8"></td>
  </tr>
</table>

请帮我做这件事,谢谢大家。

标签: javascriptjqueryhtml

解决方案


也许是这样的?您可以使用each()which 将为您提供元素和索引。

$(document).ready(function() {
  $('.myTable td').each((i, e) => {
    $(e).attr('id', `td${(i + 1)}`);
    $(e).html(`td${(i + 1)}`);
  });
});
<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>

<table class="myTable">
  <tr class="tr">
    <td class="td"></td>
    <td class="td"></td>
    <td class="td"></td>
    <td class="td"></td>
  </tr>
  <tr class="tr">
    <td class="td"></td>
    <td class="td"></td>
    <td class="td"></td>
    <td class="td"></td>
  </tr>
</table>


推荐阅读