我已经在我的本地系统中保存了一个JSON文件，并创建了一个JavaScript文件，以便读取JSON文件并打印数据。以下是JSON文件:
{"resource":"A","literals":["B","C","D"]}
假设这是JSON文件的路径:/Users/Documents/workspace/test.json。
谁能帮我写一段简单的代码来读取JSON文件并用JavaScript打印数据?
当前回答
非常简单。 将json文件重命名为“.js”而不是“.json”。
<script type="text/javascript" src="my_json.js"></script>
所以正常地遵循你的代码。
<script type="text/javascript">
var obj = JSON.parse(contacts);
然而，只是为了信息，我的json内容看起来像下面的剪辑。
contacts='[{"name":"bla bla", "email":bla bla, "address":"bla bla"}]';
其他回答
您不能对本地资源进行AJAX调用，因为请求是使用HTTP发出的。
一个解决方案是运行一个本地web服务器，提供文件并对localhost进行AJAX调用。
为了帮助你编写代码来读取JSON，你应该阅读jQuery.getJSON()的文档:
http://api.jquery.com/jQuery.getJSON/
您可以使用fetch()在async await的帮助下完成此操作。这是从url获取数据的最新和最安全的方式。
const url = "../asset/videoData.json";
const fetchJson = async () => {
try {
const data = await fetch(url);
const response = await data.json();
} catch (error) {
console.log(error);
}
};
你也可以使用它从外部url获取数据。
如果你能运行本地web服务器(就像Chris P上面建议的那样)，如果你能使用jQuery，你可以试试http://api.jquery.com/jQuery.getJSON/
2021解决方案(适用于Chrome 91+)
导入JSON文件的JS文件应该是一个模块:
<script type=“module” src=“script.js”></script>
然后在script.js中导入json文件:
从"./data "导入数据。Json: assert {type: " Json "};
您可以使用console.log(data)检查数据是否已加载
源
当在Node.js中或在浏览器中使用require.js时，你可以简单地做:
let json = require('/Users/Documents/workspace/test.json');
console.log(json, 'the json obj');
注意:文件加载一次，后续调用将使用缓存。
