如何优化Google Apps Script实现一次性读取表格值填充HTML表单

第一步：合并Google Apps Script函数 #

删掉原来所有的todayXXValue函数，替换成一个函数一次性拉取最后一行的所有目标列数据：

function getTodayScheduledValues() {
  const ss = SpreadsheetApp.getActiveSpreadsheet();
  const scheduleSheet = ss.getSheetByName("Scheduled");
  const lastRow = scheduleSheet.getLastRow();
  // 这里取第2列到第9列的最后一行数据，后续有新增字段可调整列范围（1,8代表从第2列开始取8列）
  const rowValues = scheduleSheet.getRange(lastRow, 2, 1, 8).getValues()[0];
  // 返回对应表单输入框ID的键值对
  return {
    L_Scheduled: rowValues[0],
    F_T_Scheduled: rowValues[1],
    B_S_Scheduled: rowValues[2],
    S_P_Scheduled: rowValues[3],
    C_M_Scheduled: rowValues[4],
    I_T_Scheduled: rowValues[5],
    STD_T_Scheduled: rowValues[6],
    S_C_Scheduled: rowValues[7]
  };
}

第二步：修改HTML表单代码 #

把原来每个输入框单独调用函数的逻辑，改成一次性获取数据后批量赋值：

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css"/>
    <style>
      .container {
          margin: 5px 5px 5px 5px;
      }
    </style>  
  </head>

  <body>
    <div class="container">
      
      <form id="inputForm" onkeydown="return event.key != 'Enter'">

        <h1 style="color:#cc0000;text-align:center;font-weight:bold;">Scheduled for Today</h1>

        <? const values = getTodayScheduledValues(); ?>

        <label for="L_Scheduled">Label1</label>
        <input type="text" name="L_Scheduled" id="L_Scheduled" style="width: 50px; text-align: center; float: right" value="<?= values.L_Scheduled ?>" />
        <br />
        <br />
        <label for="F_T_Scheduled">Label2</label>
        <input type="text" name="F_T_Scheduled" id="F_T_Scheduled" style="width: 50px; text-align: center; float: right" value="<?= values.F_T_Scheduled ?>" />
        <br />
        <br />
        <label for="B_S_Scheduled">Label3</label>
        <input type="text" name="B_S_Scheduled" id="B_S_Scheduled" style="width: 50px; text-align: center; float: right" value="<?= values.B_S_Scheduled ?>" />
        <br />
        <br />
        <label for="S_P_Scheduled">Label4</label>
        <input type="text" name="S_P_Scheduled" id="S_P_Scheduled" style="width: 50px; text-align: center; float: right" value="<?= values.S_P_Scheduled ?>" />
        <br />
        <br />
        <label for="C_M_Scheduled">Label5</label>
        <input type="text" name="C_M_Scheduled" id="C_M_Scheduled" style="width: 50px; text-align: center; float: right" value="<?= values.C_M_Scheduled ?>" />
        <br />
        <br />
        <label for="I_T_Scheduled">Label6</label>
        <input type="text" name="I_T_Scheduled" id="I_T_Scheduled" style="width: 50px; text-align: center; float: right" value="<?= values.I_T_Scheduled ?>" />
        <br />
        <br />
        <label for="STD_T_Scheduled">Label7</label>
        <input type="text" name="STD_T_Scheduled" id="STD_T_Scheduled" style="width: 50px; text-align: center; float: right" value="<?= values.STD_T_Scheduled ?>" />
        <br />
        <br />
        <label for="S_C_Scheduled">Label8</label>
        <input type="text" name="S_C_Scheduled" id="S_C_Scheduled" style="width: 50px; text-align: center; float: right" value="<?= values.S_C_Scheduled ?>" />
        <br />
        <br />
      </form>
    </div>
  </body>
</html>

优化说明 #

• 之前每个字段单独调用函数，等于和Google Sheets做30次独立交互，这就是加载慢的核心原因。
• 新方案只发起一次数据请求，把最后一行所有需要的列数据一次性拉取回来，再通过模板变量分配到对应输入框，加载速度会显著提升。
• 后续新增字段时，只需要调整getTodayScheduledValues里的列范围和返回的键值对即可，无需再编写新函数。

内容的提问来源于stack exchange，提问作者Codedabbler