javascript - 无法使用 json 对象通过 Javascript 显示动态表

标签 javascript jquery arrays json

我必须检索 Json 中的数据,然后将其显示在表格中。我尝试了几种方法,但没有成功。这是我的这个函数的代码,有人可以帮助我找出这个代码有什么问题,因为我没有显示任何内容,也没有错误。谢谢您

代码已更新。

<!DOCTYPE html>
<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>

<h1>display the menu</h1>

<button type="button" onclick="loadDoc()">Request data</button>

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

<script>
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
     
    var obj = JSON.parse(this.responseText);
  
  var html = "<table border='1|1'>";

  for (var i = 0; i < obj.response.length; i++) {
          html+="<tr>";
          html+="<td>"+obj.response[i].id+"</td>";
          html+="<td>"+obj.response[i].restaurant_id+"</td>";
          html+="<td>"+obj.response[i].name+"</td>";
          html+="</tr>";

       }

   html+="</table>";
  $("div").html(html);
}

  };
  xhttp.open("GET", "http://deleted url sorry", true);
  xhttp.send();

}
</script>

</body>
</html>

我必须检索 Json 中的数据,然后将其显示在表格中。我尝试了几种方法,但没有成功。这是我的这个函数的代码,有人可以帮我找出这段代码有什么问题吗?谢谢

<!DOCTYPE html>
<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>

<h1>display the menu</h1>

<button type="button" onclick="loadDoc()">Request data</button>

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

<script>
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
     document.getElementById("demo").innerHTML = this.responseText;
    var obj = JSON.parse(this.responseText);
   //document.getElementById("demo").innerHTML = obj.response[0].id + " " + obj.response[0].restaurant_id + " "+ obj.response[0].name;

}

var count = 0;
var html = "<table border='1|1'>";
for (var k in obj) {
    if (obj.hasOwnProperty(k))
    {  ++count; }
//document.getElementById("demo").innerHTML = obj.response[count].id + " " + obj.response[count].restaurant_id + " "+ obj.response[count].name;



        html+="<tr>";
        html+="<td>"+obj.response[count].id+"</td>";
        html+="<td>"+obj.response[count].restaurant_id+"</td>";
        html+="<td>"+obj.response[count].name+"</td>";
        html+="</tr>";

     }

 html+="</table>";
$("div").html(html);
  };
  xhttp.open("GET", "the URL I deleted it when posting", true);
  xhttp.send();


}
</script>

</body>
</html>

感谢您的帮助。

最佳答案

当您执行 $('div').html() .... 页面中不存在 div 元素,因此不会呈现任何内容

关于javascript - 无法使用 json 对象通过 Javascript 显示动态表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40905368/

相关文章:

c# - CSS + jQuery - 无法执行 .toggle() 并重复 jQueryTemplate Item [我必须警告你这有点让人不知所措]

ios - Swift 字典将 [UInt8] 作为值不起作用

javascript - Delphi 中的 AES 编码 XE4 Javascript 中的解码

javascript - 在 IE 中加载和解析 XML

c# - 十进制值对价格无效。 MVC3

javascript - 将预定义的 html 添加到带有按钮的 div

javascript - 将单选按钮添加到自动完成字段

c - 在堆栈上对齐或不对齐字符数组?

Javascript使用优先级数组对对象数组进行排序

javascript - 计算属性对 VueJS 中的 window.innerwidth react