Json到HTMLUL列表。纯javascript

如何将json响应转换为html

ul

list

{
    "subject": [
        "The subject field is required."
    ],
    "message": [
        "The message field is required."
    ]
} 

对此

<ul>
    <li>The subject field is required</li>
    <li>The message field is required</li>
</ul>

“主题”字段是必填字段
消息字段是必需的

并在某个div中显示它

<div id="errors"></div>

试试这个：

var parent = document.createElement("ul");
document.body.appendChild(parent);

var obj = {
    "subject": [
        "The subject field is required."
    ],
    "message": [
        "The message field is required."
    ]
}

var keys = Object.keys(obj);

for(var i = 0; i < keys.length; i++) {
  var child = document.createElement("li");
  child.innerHTML = obj[keys[i]][0];
  parent.appendChild(child);
}

var parent=document.createElement（“ul”）；
document.body.appendChild（父级）；
var obj={
“主题”：[
“主题字段是必需的。”
],
“信息”：[
“消息字段是必需的。”
]
}
var keys=Object.keys（obj）；
对于（变量i=0；i

有很多方法，但最直观的方法是将HTML构建为字符串，然后使用element.innerHTML属性将HTML字符串插入div元素中

要构建HTML，请执行以下操作

var theHTMLString = "<ul>";
for(var propertyName in myObject) {
   theHTMLString += "<li>" + myObject[propertyName] + "</li>";
}
theHTMLString += "</ul>";

现在我们已经为对象和我们想要注入到其中的HTML创建了一个函数，只需使用将HTML添加到div

theDIV.innerHTML = theHTMLString;

---

你已经试过什么了吗？什么失败了？我想你应该从JavaScript教程开始。不过我还是建议你自己尝试一下。与其盲从我的答案，不如把它作为参考。

var theDiv = document.getElementById( "errors" );

theDIV.innerHTML = theHTMLString;