您可以调用中的元素 exampleArray 行，而它们实际上是列。这可能是产生混淆的原因。请参阅下面的代码片段以了解工作示例。

const exampleArray = [
  {
    header: 'ID',
    values: [1, 2]
  },
  {
    header: 'First Name',
    values: ['John', 'Jayne']
  },
  {
    header: 'Last Name',
    values: ['Doe', 'Doe']
  }
];

const header = $('#results thead tr');
const body = $('#results tbody');

exampleArray.forEach((column) => {
  header.append(
    $(`<th>${column.header}</th>`)
  );
});

// Compute the number of rows in the array
const nRows = exampleArray[0].values.length;

for (let i = 0; i < nRows; i++) {
  // row contains all cells in a row
  let row = $("<tr/>");
  // Loop over the columns
  exampleArray.forEach((column) => {
    // For each column, we add the i-th value, since we're building the i-th row
    row.append(`<td>${column.values[i]}</td>`);
  });
  // Add the row to the table body
  body.append(row);
}

<table id="results">
<thead>
<tr>
  <!-- HEADERS -->
</tr>
</thead>
<tbody>

</tbody>
</table>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

只需迭代数组的每个值项并将其附加到每列：

const exampleArray = [{
    header: 'ID',
    values: [1, 2]
  },
  {
    header: 'First Name',
    values: ['John', 'Jayne']
  },
  {
    header: 'Last Name',
    values: ['Doe', 'Doe']
  }
];

const header = $('#results thead tr');
const body = $('#results tbody');

exampleArray.forEach((row) => {
  header.append(
    $(`<th>${row.header}</th>`)
  );
});

// This does the magic

// Iterate up to the values length (row length)
for (var i = 0; i < exampleArray[0].values.length; i++) {
  // Create new row
  body.append("<tr id='row-" + i + "'></tr>");
  // Iterate all items (columns)
  exampleArray.forEach((column) => {
    // Append value to the row
    $("#row-" + i).append("<td>" + column.values[i] + "</td>");
  });
}

<table id="results">
  <thead>
    <tr>
      <!-- HEADERS -->
    </tr>
  </thead>
  <tbody>

  </tbody>
</table>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

你可以使用 for 循环进行迭代 0 长到 values 属性，并使用嵌套循环在每个单独项的索引处获取该项：

const tableData = [{
    header: 'ID',
    values: [1, 2]
  },
  {
    header: 'First Name',
    values: ['John', 'Jayne']
  },
  {
    header: 'Last Name',
    values: ['Doe', 'Doe']
  }
]

const header = $('#results thead tr');
const body = $('#results tbody');

tableData.forEach((row) => {
  header.append(
    $(`<th>${row.header}</th>`)
  );
});

for (let i = 0; i < tableData[0].values.length; i++) {
  var row = document.createElement("tr");
  tableData.forEach(f => $(row).append(`<td>${f.values[i]}</td>`));
  body.append(row);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="results">
  <thead>
    <tr id="headers">
    </tr>
  </thead>
  <tbody id="b">

  </tbody>
</table>