如何在JavaScript中透视对象数组并在HTML上显示

var students = [
  { name: "Alice", age: 20, grade: "A" },
  { name: "Bob", age: 22, grade: "B" },
  { name: "Charlie", age: 21, grade: "A+" }
];

<table id="studentTable">
  <thead>
    <tr>
      <th>Name</th>
      <th>Age</th>
      <th>Grade</th>
    </tr>
  </thead>
  <tbody>
    <!-- 表格内容将在JavaScript中生成 -->
  </tbody>
</table>

var tableBody = document.querySelector("#studentTable tbody");

students.forEach(function(student) {
  var row = document.createElement("tr");
  var nameCell = document.createElement("td");
  var ageCell = document.createElement("td");
  var gradeCell = document.createElement("td");

  nameCell.textContent = student.name;
  ageCell.textContent = student.age;
  gradeCell.textContent = student.grade;

  row.appendChild(nameCell);
  row.appendChild(ageCell);
  row.appendChild(gradeCell);

  tableBody.appendChild(row);
});