gpt4 book ai didi

javascript - 如何使用 javascript 读取包含数组数据的本地 json 文件?

转载 作者:行者123 更新时间:2023-11-29 21:12:47 26 4
gpt4 key购买 nike

我有这个 .json 文件,我想将它加载到一个全局变量中,我可以使用 AJAX、JavaScript 从所有 Web 访问该变量。我该怎么做?我想通过索引访问变量,例如 my_var[1].img。我阅读了很多帖子,但没有找到解决方案。

我的数据.json

{
"data": [
{ "img": "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRHQ5Sf2Cffo0QdRtFw0t8zdk90FWgywc1kDKAuOV874zYO_0pC", "other": "Ra.One" },
{ "img": "https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcQkVg9n2UbPTeiPNGUOw2SqdAzJsZzuHrkYw78sjaMMCcTWcuFjUtT3NZ8", "other": "3 Idiots" },
{ "img": "https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcQ0Wam0d96ASpEHDFfskGTBdILKlDpXAKzELFdfdKmkoye5JmrF9qS1u1qtZw", "other": "Chaalis Chauraasi (4084)" },
{ "img": "https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcSAf7q-m96JL88_W8EATmVlwCfOKb5dw1keyDSO6PWwzaSVtqGyix2lvE", "other": "Gangs Of Wasseypur" }
]}

index.html

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>MyWeb</title>

<script type="text/javascript" src="myData.json"></script>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>

</head>
<body>

<script>
var my_json;
$.getJSON("myData.json", function(json) {
my_json = json;
});
</script>
</body>
</html>

最佳答案

鉴于 jQuery.getJSON 是一个异步函数,您必须在回调中使用数据。如果你想将它保存在一个全局变量中,请记住你仍然必须使用一个由 getJSON 的回调调用的函数来使用它(尽管我不推荐它)。鉴于您的 JSON 结构,您可以使用 json.data[index].img 访问图像,并像这样创建全局变量 my_json = json.data 以供稍后使用像这样 my_json[index].img。这是一个例子:

var my_json;

function useTheData() {
for (var i = 0; i < my_json.length; i++) {
console.log(i, "-", my_json[i].img);
}
}

$.getJSON("myData.json", function(json) {
my_json = json.data;
useTheData();
});

如果您想在脚本主体中访问您的变量(即不在另一个函数中),那么您唯一能做的就是使用 同步 请求,该请求由 XMLHttpRequest 创建,像这样:

var xhr = new XMLHttpRequest(),
my_json;

xhr.open('GET', 'myData.json', false);
xhr.send();

my_json = JSON.parse(xhr.responseText).data;

// Now use the my_json variable anywhere you want

请注意,这会减慢您的脚本并停止呈现和执行您的页面,直到请求完成,所以我真的不建议这样做。

关于javascript - 如何使用 javascript 读取包含数组数据的本地 json 文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40946612/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com