如何在单个语句中应用多个索引

how to apply more than one indexing in a single statement

我正在处理动态 table,其中 javascript 读取 table,然后分别响应 table 的列。我希望在 col 语句中使用 row 例如 col = x[i].rows[row].cells.length;相反。

function add() {
  var x, y, z, i, j, row, col;
  x = document.querySelectorAll(".tab");

  for (i = 0; i < x.length; i++) {
    y = x[i].insertRow();

    row = parseInt(x[i].rows.length);
    col = x[i].rows[1].cells.length; //should get the length of last row of the table
    for (j = 0; j < col; j++) {
      if (j == 0) {
        y.insertCell(j).innerHTML = "<input type='checkbox'>";
      } else {
        y.insertCell(j).innerHTML = row;
      }
    }
  }
}
<table border=1 class="tab">
  <tr>
    <td colspan=3>Table 1</td>
  </tr>
  <tr>
    <td><input type="checkbox"></td>
    <td>c1</td>
    <td>c2</td>
  </tr>
</table><br>
<table border=1 class="tab">
  <tr>
    <td colspan=3>Table 2</td>
  </tr>
  <tr>
    <td><input type="checkbox"></td>
    <td>c1</td>
    <td>c2</td>
  </tr>
</table>
<button onclick="add()">add</button>

您应该使用各自的分组标签将 header <tr> 和 body <tr> 分开。然后你可以通过使用类似 x[i].tBodies[0].rows.length 的东西单独在 body 中获得 <tr>s。示例只有一个 tbody 标签,因此直接读取 0 索引。

function add() {
  var x, y, z, i, j, row, col;
  x = document.querySelectorAll(".tab");

  for (i = 0; i < x.length; i++) {
    y = x[i].insertRow();

    row = x[i].tBodies[0].rows.length;
    col = x[i].rows[row - 1].cells.length; //should get the length of last row of the table
    for (j = 0; j < col; j++) {
      if (j == 0) {
        y.insertCell(j).innerHTML = "<input type='checkbox'>";
      } else {
        y.insertCell(j).innerHTML = row;
      }
    }
  }
}
<table border=1 class="tab">
  <thead>
    <tr>
      <td colspan=3>Table 1</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><input type="checkbox"></td>
      <td>c1</td>
      <td>c2</td>
    </tr>
  </tbody>
</table>
<button onclick="add()">add</button>