HTML表格转JS数组调用setValues写入Google Sheets结构异常问题

提取HTML可编辑表格内容，通过Google Apps Script的setValues()方法写入Google Sheets时写入失败，执行流程如下：

• 点击按钮弹出HTML弹窗
• 弹窗内置支持用户编辑输入的HTML表格
• 用户点击「Generate Brief」按钮时，触发前端脚本内的*pasteBrief()*函数
• 前端函数调用服务端GAS函数pasteBriefVal(tableval)，将采集到的表格数据传递到服务端执行写入
• 故障表现：已确认数据被成功推入数组，但数组结构不符合setValues()参数规范，数据无法按预期格式写入。

代码存在两个直接触发setValues()报错的问题：

1. 传入的数组结构不符合API要求：setValues()要求参数为二维数组，外层数组长度对应写入行数，内层每个数组长度对应该行的列数，格式为[[行1列1, 行1列2,...], [行2列1, 行2列2,...]]。你当前的循环逻辑是将每个单元格值单独包裹为单元素数组推入总数组，最终得到的是总长度为「总行数*总列数」的数组（每个元素为单值数组），相当于所有数据排成1列，和表格实际列数完全不匹配。
2. 写入范围非法：你使用的b1:u是未指定结束行的开放范围，setValues()要求写入范围的行列数必须和传入数组的行列数完全一致，不支持传入无固定边界的范围。

HTML端代码 #

调整数组构造逻辑，每遍历完一整行再将行数据推入总数组；改用textContent获取单元格纯文本，避免将用户输入产生的冗余HTML标签写入表格；移除了外链图片地址，仅保留功能逻辑。

<div>
    <img onclick="newRows()" width="25px" height="auto" alt="新增行">
    <img onclick="newRowssss()" width="25px" height="auto" alt="删除行">
    <button id="btn" onclick="pasteBrief()" style="color: #63d297;">Generate Brief</button>

    <table id="brief_table">
      <thead>
          <tr>
              <th>Content category</th>
              <th>Description</th>
              <th>Content type</th>
              <th>Format</th>
              <th>Channel</th>
              <th>Assets</th>
              <th>Start date</th>
              <th>End date</th>
              <th>Relevant links</th>
              <th>Comments</th>
          </tr>
      </thead>
      <tbody>
          <tr>
              <td contenteditable='true'></td>
              <td contenteditable='true'>Test</td>
              <td contenteditable='true'></td>
              <td contenteditable='true'></td>
              <td contenteditable='true'></td>
              <td contenteditable='true'>Test</td>
              <td contenteditable='true'>Test</td>
              <td contenteditable='true'>Test</td>
              <td contenteditable='true'>Test</td>
              <td contenteditable='true'>Test</td>
          </tr>
      </tbody>
  </table>
</div>

<script>
function pasteBrief() {    
  const table = document.getElementById("brief_table");
  const tableValues = [];
  // 遍历表格所有行
  for (let r = 0; r < table.rows.length; r++) {
    const currentRow = [];
    // 遍历当前行的所有单元格
    for (let c = 0; c < table.rows[r].cells.length; c++) {
      currentRow.push(table.rows[r].cells[c].textContent.trim());
    }
    // 整行数据收集完成后推入总结果数组
    tableValues.push(currentRow);
  }
  google.script.run.pasteBriefVal(tableValues);
}
</script>

GAS服务端代码 #

根据传入数组的行列数动态构造匹配的写入范围，从B1单元格开始写入，保证范围尺寸和数组尺寸完全一致：

function pasteBriefVal(tableval){
  const sheet = SpreadsheetApp.getActive().getSheetByName('Sheet1');
  const rowCount = tableval.length;
  const colCount = tableval[0].length;
  // getRange参数依次为：起始行号、起始列号、写入行数、写入列数，B列对应列号2
  sheet.getRange(1, 2, rowCount, colCount).setValues(tableval);
}

• 如果不需要写入表头（thead中的th内容），行遍历从r=1开始即可跳过第0行的表头数据。
• 动态新增/删除表格行后，该逻辑依然可以自动识别当前表格的行列数，无需额外调整。

内容的提问来源于stack exchange，提问作者A. Prats