其他分享
首页 > 其他分享> > HTML结合JSON做表格

HTML结合JSON做表格

作者：互联网

 

使用作为JSON接收到的数据来生成表格:

<!DOCTYPE html>
<html>
<body>

<h2>做一个基于 JSON 数据的表格。</h2>

<p id="demo"></p>

<script>
var obj, dbParam, xmlhttp, myObj, x, txt = "";
obj = { table: "customers", limit: 20 };
dbParam = JSON.stringify(obj);
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    myObj = JSON.parse(this.responseText);
    txt += "<table border='1'>"
    for (x in myObj) {
      txt += "<tr><td>" + myObj[x].name + "</td></tr>";
    }
    txt += "</table>"    
    document.getElementById("demo").innerHTML = txt;
  }
};
xmlhttp.open("POST", "json_demo_db_post.php", true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send("x=" + dbParam);
</script>

</body>
</html>

 

标签：xmlhttp,表格,JSON,HTML,myObj,obj,txt,dbParam
来源： https://www.cnblogs.com/dzwj/p/15871737.html