一个ForEach函数，用于将一个tr转换为三个to，并生成一个动态表格

基础概念

ForEach 函数是一种常见的数组方法，用于遍历数组中的每个元素，并对每个元素执行指定的操作。在 JavaScript 中，forEach 方法是数组对象的一个内置方法，它接受一个回调函数作为参数，并对数组中的每个元素调用该回调函数。

类型

forEach 函数通常用于处理数组类型的数据。

应用场景

在处理表格数据时，forEach 函数可以用于将一行数据（如 tr）转换为多个单元格数据（如 td），并生成动态表格。

示例代码

假设我们有一个包含多个对象的数组，每个对象代表一行数据，我们需要将这些数据转换为表格形式。

// 示例数据
const data = [
  { name: 'Alice', age: 25, city: 'New York' },
  { name: 'Bob', age: 30, city: 'Los Angeles' },
  { name: 'Charlie', age: 35, city: 'Chicago' }
];

// 创建表格元素
const table = document.createElement('table');
table.border = '1';

// 添加表头
const thead = document.createElement('thead');
const headerRow = document.createElement('tr');
['Name', 'Age', 'City'].forEach(headerText => {
  const th = document.createElement('th');
  th.textContent = headerText;
  headerRow.appendChild(th);
});
thead.appendChild(headerRow);
table.appendChild(thead);

// 添加数据行
const tbody = document.createElement('tbody');
data.forEach(item => {
  const tr = document.createElement('tr');
  ['name', 'age', 'city'].forEach(key => {
    const td = document.createElement('td');
    td.textContent = item[key];
    tr.appendChild(td);
  });
  tbody.appendChild(tr);
});
table.appendChild(tbody);

// 将表格添加到页面
document.body.appendChild(table);