获取连续表格单元格的值（JS 或 jQuery）

Question

我有一张桌子，其中包含 50 个相同的

<tr>
    <td>#</td>
    <td>#</td>
    <td>123123</td>
</tr>
...

现在我可以像这样获取特定行的值

$("#tableId tbody tr").each(function(){
    var a = $(this).children();
    var arr =a[2].innerText; //get each row
    a[2].innerText = statename // get the third cell in each row
});

在这种情况下， statename是一个具有 50 个状态名称的对象。 我现在要做的就是将123123替换为对象内的每个状态名称。 所以它看起来像这样：

<tr>
    <td>#</td>
    <td>#</td>
    <td>Alabama</td>
</tr>
<tr>
    <td>#</td>
    <td>#</td>
    <td>Alaska</td>
</tr>
<tr>
    <td>#</td>
    <td>#</td>
    <td>Arizona</td>
</tr>
...

我试图在 jQuery 中循环，但没有奏效。 请帮忙，非常感谢。

Answer 1

您可以尝试将each方法与find方法一起使用，在选择器名称中，您可以通过td:last搜索最后一个<td>元素。 像这样：

 var statenames = ['Alabama', 'Alaska', 'Arizona']; $("#tableId tbody tr").each(function(index){ $(this).find('td:last').text(statenames[index]); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table id="tableId"> <tbody> <tr> <td>#</td> <td>#</td> <td>123123</td> </tr> <tr> <td>#</td> <td>#</td> <td>123123</td> </tr> <tr> <td>#</td> <td>#</td> <td>123123</td> </tr> </tbody> </table>

Answer 2

通过使用 vanilla js，您可以轻松获取 tr 中的最后一个 td 元素，遍历它们并为节点分配新值

 const stateNames = ['Alabama', 'Alaska', 'Arizona']; document.querySelectorAll('tr td:last-child') .forEach((x, i) => x.textContent = stateNames[i])

 <table> <tr> <td>#</td> <td>#</td> <td>123123</td> </tr> <tr> <td>#</td> <td>#</td> <td>123123</td> </tr> <tr> <td>#</td> <td>#</td> <td>123123</td> </tr> </table>

Answer 3

确保您的变量statename是一个数组，并且不要忘记状态的索引

// find elements
statename = ["Alabama", "Alaska", "Arizona"]
$("#tableId tbody tr").each(function(index){
    var a = $(this).children();
    var arr =a[2].innerText; //get each row
    a[2].innerText = statename[index] // get the third cell in each row
});