使用 Jquery find() 编辑表，然后使用 before() 添加包含数组数据的单元格

Question

我正在尝试使用数组中的数据插入一列单元格。 我曾尝试使用 for 循环，但这只是将数组的所有数据放入每个新单元格中。 我的目标是让新单元格分别显示 row_header1、row_header2 或 row_header3。
谁能帮我解决这个问题？ 谢谢你。

-for 循环我试过了。

for (var i = 0, len = arr1.length; i < len; i++) {
      $("tr").find("td:first").before('<td>' + arr1[i] + '</td>')

 var arr1 = ["row_header1", "row_header2", "row_header3"]; $(document).ready(function() { $("#btn").click(function() { var i = 0, len = arr1.length; i < len; i++; $("tr").find("td:first").before('<td>' + arr1[i] + '</td>') }); });

 td, th { padding: 4px; border: solid; width: 50px; height: 50px; } table { border-collapse: collapse; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <button id="btn">+</button> <table id='table'> <tr> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> </tr> </table>

Answer 1

我认为每次要分配值时都需要 select 正确的tr

 var arr1 = ["row_header1", "row_header2", "row_header3"]; $(document).ready(function() { $("#btn").click(function() { var i = 0, len = arr1.length; while(i< len){ $("tr:eq("+i+")").find("td:first").before('<td>' + arr1[i] + '</td>'); i++; } }); });

 td, th { padding: 4px; border: solid; width: 50px; height: 50px; } table { border-collapse: collapse; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <button id="btn">+</button> <table id='table'> <tr> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> </tr> </table>