将 .json 文件导入 javascript 时，我的 HTML 文件无法从 javascript
嘿，这真的很奇怪。
我将在这里给出一些代码示例：
HTML：
<body style="background-color:rgb(157, 163, 163)" onload="createData()">
<script src="indexLIS.js"></script>
<script src="assets/initData.json"></script>
</body>
Javascript：
//import dataSource from './assets/initData.json';
function createData(){
console.log("hey");
}
JSON：
{
"dataSource":[
{
"id": 0,
"name":"TemporaryName",
"node-level":0
}
]
}
在一个即使如此简单的代码示例中，每次我打开 HTML 时，我几乎都会立即在控制台上打印“嘿”。但是，如果我取消注释第一行 javascript 代码并从 initData.json 导入数据，那么我会立即收到错误“createData not defined”，就好像 HTML 代码完全失去了与 javascript 文件通信的能力。
慕桂英546537浏览 270回答 2
2回答
-
函数式编程
编辑：我刚刚意识到您正在使用上面的 es6 模块语法（它对我来说就像代码注释）。原答案：你不能加载json在script标签。当你这样做时，浏览器无法解析它，这会杀死页面上的所有脚本执行。如果您将initData.json文件更改为initData.js：var jsonData = { "dataSource":[ { "id": 0, "name":"TemporaryName", "node-level":0 } ]};然后，您应该能够从全局jsonData变量中引用数据。 -
倚天杖
我最终能够让它为我工作。我不能肯定地说这是否是最适合每个人的答案，但它完成了我打算做的事情。HTML：<body style="background-color:rgb(157, 163, 163)" onload="createData()"> <script type="text/javascript" src="indexLIS.js"></script></body>Javascript：function createData() { $.getJSON('./assets/initData.json', function(json) { console.log(json.dataSource); });}Json 本身没有任何变化，所以我不会发布它，但是这样我就能够导入 JSON 数据并与之交互，而不会破坏 javascript 文件和 html 之间的关系。必须在该function(json){}部分中的 json 中执行您想做的所有事情似乎是有限的，但我在那里所做的只是发送json到另一个函数，因此它确实根本不会减慢我的速度。
随时随地看视频慕课网APP
相关分类
JavaScript