js 循环数组添加json

你可以使用 JavaScript 中的循环语句（如 for 循环）来遍历数组，并在每个循环中将 JSON 对象添加到数组中。下面是一个示例代码：

var jsonArray = []; // 创建一个空数组用于存储 JSON 对象

var array = [1, 2, 3, 4, 5]; // 示例数组

for (var i = 0; i < array.length; i++) {
  var obj = {}; // 创建一个空的 JSON 对象
  obj.key = array[i]; // 设置 JSON 对象的属性
  jsonArray.push(obj); // 将 JSON 对象添加到数组中
}

console.log(jsonArray); // 输出数组中的 JSON 对象

这段代码将创建一个名为 `jsonArray` 的空数组，并遍历 `array` 数组中的每个元素。在每次循环中，它会创建一个新的空 JSON 对象 `obj`，并将当前元素的值赋给该对象的属性 `key`。然后，它将该 JSON 对象添加到 `jsonArray` 数组中。最后，通过 `console.log` 输出数组中的 JSON 对象。

你可以根据你的需求修改代码来适应你的具体情况。希望对你有所帮助！

相关问题

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

可以使用循环遍历数组，动态生成表格，最后一行添加一个详情按钮，并为按钮绑定点击事件的监听器。在事件处理函数中，可以根据点击的按钮获取该行对应的 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];

// 循环遍历数组，为每个数组元素生成一个表格行
for (var i = 0; i < data.length; i++) {
  var row = tbody.insertRow(); // 创建表格行
  
  // 创建表格单元格并填充数据
  var cellName = row.insertCell();
  cellName.innerHTML = data[i].name;
  
  var cellAge = row.insertCell();
  cellAge.innerHTML = data[i].age;
  
  var cellGender = row.insertCell();
  cellGender.innerHTML = data[i].gender;
  
  // 创建详情按钮并为其绑定点击事件的监听器
  var cellAction = row.insertCell();
  var button = document.createElement("button");
  button.innerHTML = "Details";
  button.rowIndex = i; // 将按钮所在的行索引保存在自定义属性中，以便在事件处理函数中使用
  button.addEventListener("click", function() {
    var index = this.rowIndex; // 获取按钮所在的行索引
    var details = data[index]; // 获取该行对应的 JSON 数据
    handleDetails(details); // 将获取到的数据作为参数传递给其他函数进行处理
  });
  
  cellAction.appendChild(button); // 将按钮添加到表格单元格中
}

// 处理详情的函数
function handleDetails(details) {
  console.log(details);
  // 在这里进行对详情的处理
}

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

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()` 函数进行处理。你可以根据需要修改代码中的数组和处理函数。