Javascript 如何将json文本转换成HTMLDOM_Javascript_Json

Javascript 如何将json文本转换成HTMLDOM

javascript json

Javascript 如何将json文本转换成HTMLDOM,javascript,json,Javascript,Json,我能够从外部URL JSON获取数据，但无法将其放入DOM中。我不太确定我做错了什么，但这是我的代码。我怀疑它与obj.fruit.json有关，但不太确定 <!DOCTYPE html> <html> <head> <title>Starting Point</title> <script> function do_exercise() { var x = new

我能够从外部URL JSON获取数据，但无法将其放入DOM中。我不太确定我做错了什么，但这是我的代码。我怀疑它与obj.fruit.json有关，但不太确定

<!DOCTYPE html>
<html>
  <head>
    <title>Starting Point</title>
    <script>
      function do_exercise()
      {
        var x = new XMLHttpRequest();
        x.open('GET', 'http://tmaserv.scem.uws.edu.au/fruit.json', true);
            x.onreadystatechange = function() {
        if (x.readyState == 4 && x.status ==200) {
            alert(x.responseText);
            obj = JSON.parse(text);
            document.getElementById("section1").innerHTML =
            obj.fruit.json[2].name + " " + 
            obj.fruit.json[2].description;
        }
      }
        x.send(null);
      }
    </script>
  </head>
  <body>
    <nav>           
      <button onclick="do_exercise();">Click Me</button>        
    </nav>
    <section id = "section1">
      <h1>Heading One</h1>
      <p>Paragraph One.</p>
    </section>
  </body>
</html>


起点
函数do_exercise（）
{
var x=新的XMLHttpRequest（）；
x、 打开（'获取'，'http://tmaserv.scem.uws.edu.au/fruit.json",对),；
x、 onreadystatechange=函数（）{
如果（x.readyState==4&&x.status==200）{
警报（x.responseText）；
obj=JSON.parse（文本）；
document.getElementById（“section1”）.innerHTML=
obj.fruit.json[2]。名称+“”+
obj.fruit.json[2].说明；
}
}
x、 发送（空）；
}
点击我
标题一
第一段

干杯


起点
函数do_练习（）{
var x=新的XMLHttpRequest（）；
x、 打开（'获取'，'http://tmaserv.scem.uws.edu.au/fruit.json",对),；
x、 onreadystatechange=函数（）{
如果（x.readyState==4&&x.status==200）{
obj=JSON.parse（x.responseText）；
document.getElementById（“section1”）.innerHTML=
obj[2]。名称+“”+
obj[2]。描述；
}
}
x、 发送（空）；
}
点击我
标题一
第一段

你的

回答看起来可能重复：你从哪里得到obj.fruit？从该URL的响应来看，我认为您应该执行obj[2]。name
或obj[2]。description以获得正确的值。感谢它的工作，只是不需要水果，json部分干杯。顺便说一句，如果没有太多麻烦，你如何列出所有内容，例如，而不是[2]如何获得所有内容？我必须使用for循环吗？Cheese表示for循环可以工作，或者您可以依赖obj.map（函数（fruit）{return fruit.name+fruit.description；}）；
<!DOCTYPE html>
<html>
<head>
  <title>Starting Point</title>
  <script>
    function do_exercise () {
        var x = new XMLHttpRequest();
        x.open('GET', 'http://tmaserv.scem.uws.edu.au/fruit.json', true);
        x.onreadystatechange = function() {
            if (x.readyState == 4 && x.status ==200) {
                obj = JSON.parse(x.responseText);
                document.getElementById("section1").innerHTML =
                obj[2].name + " " + 
                obj[2].description;
            }
        }

        x.send(null);
    }
  </script>
</head>
<body>
    <nav>           
      <button onclick="do_exercise();">Click Me</button>      
    </nav>
    <section id = "section1">
      <h1>Heading One</h1>
      <p>Paragraph One.</p>
    </section>
</body>
</html>