从API Javascript获取JSON数据

因此，我一直在从事一个小型项目，但我似乎无法从JavaScript中的JSON文件中获取数据

我在控制台中显示了数据，但是如果我想打印出第一个数组，我会得到值“undefined”

这是我的script.js文件：

var URL = "https://api.themoviedb.org/3/movie/popular?api_key=f1d314280284e94ff7d1feeed7d44fdf&language=en-US&page=1";

var ourRequest = new XMLHttpRequest;

ourRequest.open('GET', URL);

ourRequest.onload = function (){

var data = ourRequest.responseText;

var ourData=JSON.parse(data);

console.log(ourData); // this line of code displays the full list of movies

console.log(ourData[0]); // this line displays undefined

---

你可以使用我写的这个函数。它用于我的挖掘池中的图形，因此您可以在上看到它的实际操作。如果失败，它将每10秒自动重试一次

function getJsonData(url, callback) {
    let request = new XMLHttpRequest;
    let timer = setTimeout(function() {
        getJsonData(url, callback);
    }, 10000);
    request.onreadystatechange = function() {
        if (request.readyState === 4 && request.status === 200) {
            clearTimeout(timer);
            return callback(JSON.parse(request.responseText));
        }
    }
    request.open('GET', url);
    request.send();
}

就这样说吧：

var jsonUrl = "https://api.themoviedb.org/3/movie/popular?api_key=f1d314280284e94ff7d1feeed7d44fdf&language=en-US&page=1";
var myData;
getJsonData(jsonUrl, function(data) {
    myData = data;
});

然后你所需要的就是：

console.log(myData.results[0]);

输出：

{vote_count: 7552, id: 299536, video: false, vote_average: 8.3, title: "Avengers: Infinity War", …}

{vote_count: 7552, id: 299536, video: false, vote_average: 8.3, title: "WOOOOOOOOHOOOOOOOO!", …}

你甚至可以：

var jsonUrl = "https://api.themoviedb.org/3/movie/popular?api_key=f1d314280284e94ff7d1feeed7d44fdf&language=en-US&page=1";
getJsonData(jsonUrl, function(data) {
    data.results[0].title = "WOOOOOOOOHOOOOOOOO!";
    console.log(data.results[0]);
});

输出：

{vote_count: 7552, id: 299536, video: false, vote_average: 8.3, title: "Avengers: Infinity War", …}

{vote_count: 7552, id: 299536, video: false, vote_average: 8.3, title: "WOOOOOOOOHOOOOOOOO!", …}

如果您将其与这样的函数结合使用，您将拥有一个异步JSON加载程序，它不会停止浏览器执行其他操作：

var myData;
loader = $('.loader');

async function refreshData() {
    loader.show();
    return new Promise(function(resolve, reject) {
        getJsonData(jsonUrl, function(data) {
            // Once the data is loaded...
            myData = data;
            insertData();
            loader.hide();
        });
    });
}

---

您确定您的图像来自该代码吗？我刚刚在该端点上执行了一个

GET

，并得到了以下对象：

{page:1，total_results:19821，total_pages:992，results:Array（20）}

。您的图像与

results

属性的值相同。请尝试

ourData.results[0]

替代。cors已阻止错误！