js 循环数组生成表格html，最后一列是详情按钮，点击详情按钮获取该行对应的json数据

可以使用循环遍历数组，动态生成表格 HTML，最后一列添加一个详情按钮，并为按钮绑定点击事件的监听器。在事件处理函数中，可以根据点击的按钮获取该行对应的 JSON 数据，并进行处理。

以下是一个示例代码：

HTML部分：

<table id="myTable">
  <thead>
    <tr>
      <th>Name</th>
      <th>Age</th>
      <th>Gender</th>
      <th>Action</th>
    </tr>
  </thead>
  <tbody></tbody>
</table>

JavaScript部分：

// 假设有一个包含 JSON 数据的数组
var data = [
  {name: "Alice", age: 20, gender: "Female"},
  {name: "Bob", age: 30, gender: "Male"},
  {name: "Charlie", age: 40, gender: "Male"}
];

// 获取表格和表格主体
var table = document.getElementById("myTable");
var tbody = table.getElementsByTagName("tbody")[0];

// 循环遍历数组，生成表格 HTML
var html = "";
for (var i = 0; i < data.length; i++) {
  html += "<tr>";
  html += "<td>" + data[i].name + "</td>";
  html += "<td>" + data[i].age + "</td>";
  html += "<td>" + data[i].gender + "</td>";
  html += "<td><button onclick='handleDetails(" + i + ")'>Details</button></td>"; // 将行索引作为参数传递给事件处理函数
  html += "</tr>";
}

tbody.innerHTML = html; // 将生成的 HTML 添加到表格主体中

// 处理详情的函数
function handleDetails(index) {
  var details = data[index]; // 获取该行对应的 JSON 数据
  console.log(details);
  // 在这里进行对详情的处理
}

以上代码会生成一个包含三行数据和一个详情按钮的表格 HTML，最后一列的详情按钮会在点击时获取该行对应的 JSON 数据，并将其作为参数传递给 `handleDetails()` 函数进行处理。你可以根据需要修改代码中的数组和处理函数。