如何在 html td id 中使用 javascript 变量

Question

为了检查表格中的单元格是否包含 javascript 中的值，似乎我需要给每个 td 一个 id。我将有数千个单元格，因此无法用其 id 输入每个 td。

目前，所有 tds 的 trs 都是用 html 中的循环生成的，所以使用 javascript 我想添加一个变量并将其粘贴在每个 id 的末尾。

我已经设法将一个 javascript 变量放入我的 html 循环中并且它正确计数，但我的问题是将它放入 id="___" 部分。

如下面的代码所示，我尝试将 document.write(i) 行放入 id，但它似乎将其视为普通文本。我还将它放在 DataEntryStatus 的输出中，只是为了证明它的计数正确，从 1 开始并随着每一行的增加而增加。

<table class="table" id="table_id">

    <tr>

        <th style="color:#ddd">fffffffffffffff<br>f<br>f<br>f</th>

        <th style="vertical-align:bottom;">Data Entry Status</th>

        <th style="vertical-align:bottom;">Tool</th>

    </tr>

<tbody id="myTable">

<script>

    var i = 1;    

</script>

{% for item in items %}

    <tr>

        <td>

            <a href="{% url 'edit_newcuts' item.pk %}" class="btn btn-primary btn-sm" role="button">Edit</a>

            <a href="{% url 'delete_newcuts' item.pk %}" class="btn btn-danger btn-sm" role="button">! X !</a>

        </td>

        <td id="DataEntryStatus"><div>{{ item.DataEntryStatus }} <script>document.write(i)</script></div></td>

        <td id="Tool + <script>document.write(i)</script>"><div>{{ item.Tool }}</div></td>

    </tr>

<script>

    i = i + 1;    

</script>

{% endfor %}

</tbody>

还有我的 javascript：

    $('#table_id tr').each(function(){

    if($('#Tool' + 'i').text() =="")$('#DataEntryStatus' + 'i').text("Entry missing");

    else if($('#CutRef' + 'i').text() =="")$('#DataEntryStatus' + 'i').text("Entry missing");

    else($('#DataEntryStatus' + 'i').text("Complete"));

    if($(this).text().toLowerCase() =="entry missing")$("#DataEntryStatus").css('background-color','#fcc');

    if($(this).text().toLowerCase() =="complete")$("#DataEntryStatus").css('background-color','#af0');

});

我想要像我的 id="Tool + document.write(i)" 行来制作像 Tool1、Tool2 之类的 ID，但现在它把 + document.write(i) 当作普通文本，我不知道如何让它作为脚本工作。