在Html中循环输出表格和数据

你可以使用 HTML 的表格元素和 JavaScript 的循环语句来动态生成表格和数据。

首先，你需要在 HTML 中创建一个空的表格元素，例如：

<table id="myTable">
  <thead>
    <tr>
      <th>姓名</th>
      <th>年龄</th>
      <th>性别</th>
    </tr>
  </thead>
  <tbody>
  </tbody>
</table>

接下来，在 JavaScript 中定义一个包含数据的数组，例如：

var data = [
  { name: "张三", age: 20, gender: "男" },
  { name: "李四", age: 25, gender: "女" },
  { name: "王五", age: 30, gender: "男" }
];

然后，使用 JavaScript 循环语句遍历数组，将每个对象的属性值插入到表格中：

var table = document.getElementById("myTable");
var tbody = table.getElementsByTagName("tbody")[0];

for (var i = 0; i < data.length; i++) {
  var row = document.createElement("tr");
  var cell1 = document.createElement("td");
  var cell2 = document.createElement("td");
  var cell3 = document.createElement("td");

  cell1.innerHTML = data[i].name;
  cell2.innerHTML = data[i].age;
  cell3.innerHTML = data[i].gender;

  row.appendChild(cell1);
  row.appendChild(cell2);
  row.appendChild(cell3);

  tbody.appendChild(row);
}

最后，你将会得到一个包含动态数据的表格。