Javascript 循环处理多维JSON数据

我试图在HTML表中显示JSON数据

示例JSON数据

[
    {
        "rect": [
        {
            "req": "108",
            "dev": "000",
            "pre": "201",
            "tst": "2019-08-10 18:18:10"
        },
        {
            "req": "107",
            "dev": "000",
            "pre": "210",
            "tst": "2019-08-04 22:05:31"
        },
        {
            "req": "106",
            "dev": "000",
            "pre": "299",
            "tst": "2019-08-04 20:24:40"
        },
        {
            "req": "105",
            "dev": "000",
            "pre": "210",
            "tst": "2019-08-04 20:24:29"
        },
        {
            "req": "104",
            "dev": "000",
            "pre": "290",
            "tst": "2019-08-04 20:16:07"
        },
        ],
        "ntif": {
            "notification": 6
        }
    }
]

这是我的JavaScript

success: function(JSONObject) {
    var peopleHTML = "";


    for (var key in JSONObject) {
        if (JSONObject.hasOwnProperty(key)) {
          peopleHTML += "<tr>";
          peopleHTML += "<td>" + JSONObject["rect"][key]["req"] + "</td>";
          peopleHTML += "<td>" + JSONObject["rect"][key]["pre"] + "</td>";
          peopleHTML += "</tr>";
    }


}


    $("#people tbody").html(peopleHTML);

}

success:function（JSONObject）{
var peopleHTML=“”；
for（JSONObject中的var键）{
if（JSONObject.hasOwnProperty（键））{
peopleHTML+=“”；
peopleHTML+=“”+JSONObject[“rect”][key][“req”]+“”；
peopleHTML+=“”+JSONObject[“rect”][key][“pre”]+“”；
peopleHTML+=“”；
}
}
$（“#people tbody”）.html（peopleHTML）；
}

输出

加载页面时，只有前3个对象被放入HTML表中，其余数据不显示在表中。

---

如何在表中显示整个数据？

您可以使用double

forEach

一次迭代外部数组，然后迭代内部数组

let数据=[{
“rect”：[{
“请求”：“108”，
“dev”：“000”，
“pre”：“201”，
“tst”：“2019-08-1018:18:10”
},
{
“请求”：“107”，
“dev”：“000”，
“pre”：“210”，
“tst”：“2019-08-04 22:05:31”
},
{
“req”：“106”，
“dev”：“000”，
“pre”：“299”，
“tst”：“2019-08-04 20:24:40”
},
{
“请求”：“105”，
“dev”：“000”，
“pre”：“210”，
“tst”：“2019-08-04 20:24:29”
},
{
“请求”：“104”，
“dev”：“000”，
“pre”：“290”，
“tst”：“2019-08-04 20:16:07”
},
],
“ntif”：{
“通知”：6
}
}]
让peopleHTML=''；
data.forEach（功能（项）{
items.rect.forEach（函数（elem）{
peopleHTML+=`
${elem.req}
${elem.pre}
`
})
})
$（“#people tbody”）.html（peopleHTML）
表tbody tr td{
边框：1px纯黑；
}
您还可以直接迭代
rect
数组


let数据=[{
“rect”：[{
“请求”：“108”，
“dev”：“000”，
“pre”：“201”，
“tst”：“2019-08-1018:18:10”
},
{
“请求”：“107”，
“dev”：“000”，
“pre”：“210”，
“tst”：“2019-08-04 22:05:31”
},
{
“req”：“106”，
“dev”：“000”，
“pre”：“299”，
“tst”：“2019-08-04 20:24:40”
},
{
“请求”：“105”，
“dev”：“000”，
“pre”：“210”，
“tst”：“2019-08-04 20:24:29”
},
{
“请求”：“104”，
“dev”：“000”，
“pre”：“290”，
“tst”：“2019-08-04 20:16:07”
},
],
“ntif”：{
“通知”：6
}
}]
让peopleHTML=''；
[].forEach.call（数据[0]。rect，函数（elem）{
peopleHTML+=`
${elem.req}
${elem.pre}
`
});
$（“#people tbody”）.html（peopleHTML）
表tbody tr td{
边框：1px纯黑；
}

为什么不用数组迭代内部对象并以这种方式访问元素->
JSONObject['rect'][index]['req']/['pre']
。Index是数组中元素的索引。您正在循环主数组的索引，并将其用于
rect
数组<代码>JSONObject
数组中有3个对象。如果要在同一个表中显示每个对象的
rect
，则需要使用嵌套for循环。（使用不带
hasOwnProperty
检查的循环。
for…in
用于对象）是的，太好了，我会试试