首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >HTML/Javascript:如何访问设置了src的脚本标记中加载的JSON数据

HTML/Javascript:如何访问设置了src的脚本标记中加载的JSON数据
EN

Stack Overflow用户
提问于 2012-11-22 22:47:06
回答 6查看 159.1K关注 0票数 100

我在服务器上生成了这个JSON文件,希望在客户机上可以访问,因为页面是可查看的。基本上,我想要实现的是:

我在html文档中声明了以下标记:

<script id="test" type="application/json" src="http://myresources/stuf.json">

其源文件中引用的文件包含JSON数据。正如我所看到的,数据已经被下载,就像脚本一样。

现在,我如何在Javascript中访问它呢?我尝试使用多种方法访问脚本标记,无论是否使用jQuery,都试图获取我的JSON数据,但不知何故这并不起作用。如果json数据是以内联方式写入脚本的,那么获取它的innerHTML就可以了。这不是,也不是我想要实现的目标。

页面加载后的远程JSON请求也不是一个选项,如果您想这样做的话。

EN

回答 6

Stack Overflow用户

发布于 2015-07-14 20:19:51

另一种解决方案是使用服务器端脚本语言,并简单地内联包含json-data。下面是一个使用PHP的示例:

<script id="data" type="application/json"><?php include('stuff.json'); ?></script>
<script>
var jsonData = JSON.parse(document.getElementById('data').textContent)
</script>

上面的例子使用了一个额外的脚本标记,类型为application/json。一种更简单的解决方案是将JSON直接包含到JavaScript中:

<script>var jsonData = <?php include('stuff.json');?>;</script>

使用额外标记的解决方案的优点是,JavaScript代码和JSON数据彼此分开。

票数 13
EN

Stack Overflow用户

发布于 2019-01-24 07:18:01

我同意本的观点。您不能加载/导入简单的JSON文件。

但是,如果您确实想这样做,并且可以灵活地更新json文件,那么您可以

my-json.js

   var myJSON = {
      id: "12ws",
      name: "smith"
    }

index.html

<head>
  <script src="my-json.js"></script>
</head>
<body onload="document.getElementById('json-holder').innerHTML = JSON.stringify(myJSON);">
  <div id="json-holder"></div>
</body>
票数 4
EN

Stack Overflow用户

发布于 2014-01-25 02:07:17

如果您需要从另一个域加载JSON:http://en.wikipedia.org/wiki/JSONP

然而,要注意潜在的XSSI攻击:https://www.scip.ch/en/?labs.20160414

如果它是相同的域,那么只需使用Ajax。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/13515141

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档