将json文件链接到html主体

时间:2018-10-05 14:32:40

标签: javascript html json

我有这个Json文件,我尝试使用脚本标签将其加载到html主体中,如下所示。

下面是html文件

<html>
<head></head>
<body>
<div id="category"></div>

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="tsTree.js"></script>  

<script type="application/json" src="gwf.json"></script>
<script type="text/javascript">

    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-36251023-1']);
    _gaq.push(['_setDomainName', 'jqueryscript.net']);
    _gaq.push(['_trackPageview']);

    (function () {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    })();

</script>
</body>
</html>

我不知道我在做什么错。请告诉我。预先感谢...

1 个答案:

答案 0 :(得分:1)

您需要使用XMLHttpRequest这样的示例:

function loadJSON(URL, callback) {

  var xobj = new XMLHttpRequest();
  xobj.overrideMimeType("application/json");
  xobj.open('GET',URL, true); 

  xobj.onreadystatechange = function() {
    if (xobj.readyState == 4 && xobj.status == "200") {
      // Required use of an anonymous callback as .open will NOT return a value but simply returns undefined in asynchronous mode
      callback(xobj.responseText);
    }
  };
  xobj.send(null);
}

其中的回调函数是接收响应(即json)并使用它的函数。