使用JavaScript遍历JSON无法获取值，寻求技术解决方案

别着急，我一眼就看到问题所在啦～你现在的代码只遍历了外层对象的key（也就是test），但data[key]其实是一个数组，里面装着你需要的虚拟机字典对象，所以你得再嵌套一层循环来遍历这个数组，才能拿到具体的cpu_count、memory_size_MiB这些值。

修改后的代码示例 #

var data = { 
  "test": [ 
    { "cpu_count": 4, "memory_size_MiB": 6144, "power_state": "POWERED_ON", "vm": "vm-1173" }, 
    { "cpu_count": 8, "memory_size_MiB": 2048, "power_state": "POWERED_ON", "vm": "vm-1173" } 
  ] 
};

// 遍历外层对象的key（这里只有"test"）
for(var key in data) {
  const vmArray = data[key]; // 这是包含所有虚拟机的数组
  console.log(`当前数据集: ${key}`);
  
  // 遍历数组里的每一个虚拟机对象
  vmArray.forEach(vm => {
    console.log("=== 虚拟机详情 ===");
    console.log(`CPU核心数: ${vm.cpu_count}`);
    console.log(`内存大小: ${vm.memory_size_MiB} MiB`);
    console.log(`电源状态: ${vm.power_state}`);
    console.log(`VM标识: ${vm.vm}`);
  });
}

更灵活的遍历方式（遍历对象所有键值对） #

如果你不确定每个虚拟机对象的键名，还可以动态遍历它的所有属性：

vmArray.forEach(vm => {
  console.log("=== 虚拟机详情 ===");
  // 遍历当前虚拟机对象的所有键值对
  for(const prop in vm) {
    console.log(`${prop}: ${vm[prop]}`);
  }
});

结合你的最终目标：生成表格 #

既然你要在Flask里生成表格，这里给你两种思路：

1. 前端JavaScript动态生成表格 #

假设页面上有一个空的表格容器：

<table id="vmTable" border="1"></table>

然后用JS渲染数据：

const table = document.getElementById('vmTable');
// 生成表头
const headerRow = table.insertRow();
const headers = ["CPU核心数", "内存(MiB)", "电源状态", "VM标识"];
headers.forEach(text => {
  const th = document.createElement('th');
  th.textContent = text;
  headerRow.appendChild(th);
});

// 生成每一行数据
vmArray.forEach(vm => {
  const row = table.insertRow();
  row.insertCell().textContent = vm.cpu_count;
  row.insertCell().textContent = vm.memory_size_MiB;
  row.insertCell().textContent = vm.power_state;
  row.insertCell().textContent = vm.vm;
});

2. Flask后端直接渲染（更简单） #

其实你也可以跳过前端Ajax，直接在Flask后端把从Redis+Celery拿到的数据传给Jinja2模板，用模板引擎生成表格：

# Flask视图函数
@app.route('/vm-table')
def vm_table():
    # 假设这里是你从Redis获取的data数据
    data = { 
        "test": [ 
            { "cpu_count": 4, "memory_size_MiB": 6144, "power_state": "POWERED_ON", "vm": "vm-1173" }, 
            { "cpu_count": 8, "memory_size_MiB": 2048, "power_state": "POWERED_ON", "vm": "vm-1173" } 
        ] 
    }
    return render_template('vm_table.html', vm_list=data['test'])

然后在vm_table.html模板里：

<table border="1">
  <tr>
    <th>CPU核心数</th>
    <th>内存(MiB)</th>
    <th>电源状态</th>
    <th>VM标识</th>
  </tr>
  {% for vm in vm_list %}
  <tr>
    <td>{{ vm.cpu_count }}</td>
    <td>{{ vm.memory_size_MiB }}</td>
    <td>{{ vm.power_state }}</td>
    <td>{{ vm.vm }}</td>
  </tr>
  {% endfor %}
</table>

这样是不是更省心？不过如果必须用Ajax的话，前端生成的方式也完全没问题～

内容的提问来源于stack exchange，提问作者user3206138