使用 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>