如何在 HTML 中列出 Javascript 对象的结构化内容?
我的对象看起来像这样:
var lists = {
"Cars":{"Ford":false,"Ferarri":false},
"Names":{"John":true,"Harry":false},
"Homework":{"Maths":true,"Science":false,"History":true,"English":true}
}
将键打印为标题,并将属性+值打印为下面的有序列表的循环会是什么样子?
示例:
汽车
- 福特=假
- 法拉利=假
名称
- 约翰 = True
- 哈利=错误
家庭作业
- 数学=正确
- 科学=错误
- 历史=真实
- 英语=正确
我知道我可以按名称将对象附加到 HTML,但如果该对象是动态的,并且 key 未知,我如何创建一个循环来执行此操作?
最佳答案
只需循环,创建 HTML 字符串,然后追加!假设你有一个容器:
<div id="container"></div>
还有你的 JS
var htmlString = "";
for (var key in lists) {
htmlString += "<span>" + key + "</span>";
htmlString += "<ul>";
for (var item in lists[key]) {
htmlString += "<li>" + item + " = " + lists[key][item] + "</li>";
}
htmlString += "</ul>";
}
document.getElementById("container").innerHTML = htmlString;
关于javascript - 在 HTML 中插入对象数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26676130/