如何为HTML中动态生成的模块表格表头添加子表头？

问题分析 #

你当前的代码在遍历模块时，每输出一个带colspan="2"的Module表头后就直接插入了新的<tr>，这会破坏表头的整体结构——正确的双行表头应该是两行完整的<tr>：第一行包含固定列（占两行）和所有Module的合并表头，第二行对应每个Module的Attempt和Result子表头。

修正后的代码 #

<table id="example" class="table table-striped table-hover table-bordered dataTableReport" cellspacing="0" width="100%">
  <thead>
    <!-- 第一行表头：固定列+合并的Module表头 -->
    <tr>
      <th rowspan="2">S.No.</th>
      <th rowspan="2">E-mail ID</th>
      <th rowspan="2">Name</th>
      <?php
      // 先查询所有模块ID，保存到数组（避免重复查询）
      $query_select = "SELECT id from tbl;";
      $result_select = mysql_query($query_select) or die(mysql_error());
      $moduleIds = [];
      while($row = mysql_fetch_array($result_select)) {
          $moduleIds[] = $row['id'];
          // 输出第一行的Module合并表头
          echo "<th style='width:5%' colspan='2'>Module ".$row['id']."</th>";
      }
      ?>
    </tr>
    <!-- 第二行表头：对应每个Module的Attempt和Result -->
    <tr>
      <?php
      foreach($moduleIds as $mid) {
          echo "<th>Attempt</th><th>Result</th>";
      }
      ?>
    </tr>
  </thead>
  <tbody>
    <!-- 这里填充表格主体内容 -->
  </tbody>
</table>

关键说明 #

1. 结构拆分：把表头明确分成两行<tr>，第一行的固定列用rowspan="2"占据两行高度，每个Module表头用colspan="2"占据两个子表头的宽度，保证表格结构的合法性。
2. 数组预存：先把所有模块ID存入数组，避免重复执行数据库查询，同时让代码逻辑更清晰。
3. 重要提示：mysql_*系列函数已经被PHP官方废弃（PHP 7及以上版本已彻底移除），建议尽快迁移到mysqli或PDO扩展，避免后续出现兼容性问题。

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