Javascript到HTML的JSON输出

我有一个JSON输出，如下所示

{
   "556520000":{
      "lmin":"35",
      "dm":[
         {
            "Width":"147"
         },
         {
            "Depth":"10"
         },
         {
            "Height":"137"
         }
      ],
      "lmax":"68",
   }
}

我试图将dm键输出到html中，这样我就可以

<span id="sku_DM">
<ul>
<li><span>A</span> Width: 147</li>
<li><span>B</span> Depth: 10</li>
<li><span>C</span> Height: 137</li>
</ul>
</span>

A宽度：147
B深度：10
C高度：137

到目前为止，我已经将JS输出到控制台ok，但是当我尝试在ID#sku_DM中输出为HTML时，它只是将最后一个值而不是控制台中的值。下面是我的JS代码

var SKU = "556520000";
var dimBreak = obj[SKU]["dm"];
for(var i = 0; i < dimBreak.length; i++){
    const dimAll = dimBreak[i];
    let entries = Object.entries(dimAll);
    
    for(const [prop, val] of entries) {
        console.log(prop, val);
        var fullDimensions = (prop, val);
        document.getElementById("sku_DM").innerHTML = fullDimensions;
    }
}

var SKU=“556520000”；
var dimBreak=obj[SKU][“dm”]；
对于（变量i=0；i

如果您能在这方面提供帮助，我将不胜感激。

---

谢谢

您可以映射

dimBreak

数组并创建所需的html标记。之后，您可以将生成的html标记注入

DOM

p.S.As

.map（）

函数返回一个数组，在将生成的html字符串插入

DOM

之前，在返回的数组上调用

.join（）

函数，将所有数组元素合并为一个字符串

const obj={
"556520000": {
“lmin”：“35”，
“dm”：[
{“宽度”：“147”}，
{“深度”：“10”}，
{“高度”：“137”}
],
“lmax”：“68”，
}
};
var SKU=“556520000”；
var dimBreak=obj[SKU][“dm”]；
设charCode=65；//A.
常量html=dimBreak.map（obj=>{
常量[key，value]=Object.entries（obj.flat（）；
返回`

${String.fromCharCode（charCode++）}
${key}:${value}

`;
});
const list=document.querySelector（“#sku_DM ul”）；
list.innerHTML=html.join（“”）



从您的话中，我理解您在渲染时不需要任何花哨的东西或任何类型的数据操作。为什么不使用一些好的
pre
HTML标记呢


const数据={
"556520000": {
“lmin”：“35”，
“dm”：[
{
“宽度”：“147”
},
{
“深度”：“10”
},
{
“高度”：“137”
}
],
“lmax”：“68”，
}
}
const dmset=Object.values（data.map）（{dm}）=>dm）
document.querySelector（'pre'）.innerHTML=JSON.stringify（dmset，null，2）
您的意思是
innerHTML+=fullDimensions
？请注意，+符号和=看起来像是在每个循环周期覆盖
innerHTML
。。。。另一方面，您似乎期望html的格式化会发生一些“神奇”的变化。您希望这会发生什么<代码>变量fullDimensions=（属性，值）我很确定它没有达到您的预期。将其更改为innerHTML+=fullDimensions只会给出大小，而不会给出键。var fullDimensions=（prop，val）不起作用。这就是我不清楚的，当控制台输出ok时，它需要是什么。谢谢你的帮助。谢谢，这正是我需要的，非常感谢你的帮助。为我节省了一些宝贵的时间。感谢更新。加入，声明。谢谢。