如何使用 getJSON 从文件中获取 JSON 数组?

Posted

技术标签:

【中文标题】如何使用 getJSON 从文件中获取 JSON 数组?【英文标题】:How to get JSON array from file with getJSON? 【发布时间】:2013-02-01 17:46:42 【问题描述】:

如何使用 javascript 和 jquery 获取 json 文件的数组 json

我正在尝试下一个代码,但它不起作用:

var questions = [];
function getArray()
    $.getJSON('questions.json', function (json) 
        for (var key in json) 
            if (json.hasOwnProperty(key)) 
                var item = json[key];
                questions.push(
                    Category: item.Category
                );
            
        
        return questions;
    )

这是名为:questions.json 的 json 文件


"Biology":
    "Category":
        "cell":
            "question1":
                "que1":"What is the cell?"
            ,
            "option1":
                "op1":"The cell is the basic structural and functional unit",
                "op2":"is a fictional supervillain in Dragon Ball"
            ,
            "answer1":"opt1"
        
    
,
"Astronomy":
    "Category":
        "Mars":
            "question1":
                "que1":"How many moons does Mars?"
            ,
            "option1":
                "op1":"5",
                "op2":"2"
            ,
            "answer1":"opt2"
        
    


我想得到一个具有这种格式的数组 Biology:Category:cell:question1....

【问题讨论】:

【参考方案1】:

$.getJSON 是一个异步函数,因此在该函数中返回一些内容什么都不做,因为它不在作用域内,或者尚未收到。您可能应该执行以下操作:

function getArray()
    return $.getJSON('questions.json');


getArray().done(function(json) 
    // now you can use json
    var questions = [];
    $.each(json, function(key, val) 
        questions[key] =  Category: val.Category ;
    );
);

【讨论】:

顺便说一句,我怎么能得到天文学的例子? console.log(questions[1].[Astronomy]),这样可以吗? 试试 console.log(questions[1][Category]) 你试过questions.Astronomy吗?使用这种方式的键实际上会变成一个对象,所以如果你想要一个数字索引数组,那么 push() 将是一种方法。【参考方案2】:

for 循环中的条件会阻止将任何内容添加到数组中。相反,请检查您的 json 对象是否具有该属性,然后获取该值并将其添加到您的数组中。换句话说:

if (questions.hasOwnProperty(key)) 应该是if (json.hasOwnProperty(key))

此外,您不能简单地return 像这样的 AJAX 调用的结果,因为该方法是异步运行的。 return 实际上是应用于内部的success 函数回调,而不是getArray。您必须使用回调模式,以便仅在收到数据后才传递数据,并相应地对其进行操作。

(当然,由于数组是在外部范围内定义的,所以无论如何您都不必返回它,但是如果您在 AJAX 方法结束之前尝试使用它,它将为空。)

假设您要使用称为 renderJSON 的方法将其渲染到 DOM:

var questions = [];
function getArray()
    $.getJSON('questions.json', function (json) 
        for (var key in json) 
            if (json.hasOwnProperty(key)) 
                var item = json[key];
                questions.push(
                    Category: item.Category
                );
            
        
        renderJSON(questions);
    );

【讨论】:

@chikatetsu 为我工作:jsfiddle.net/H2jQD。 “不工作”是什么意思?你希望它做什么? P.S. @whoeverdownvoted 总是很好解释为什么...OP 在我的帖子之后更改了代码,因此您无法看到旧问题。

以上是关于如何使用 getJSON 从文件中获取 JSON 数组?的主要内容,如果未能解决你的问题,请参考以下文章

从 URL 获取 JSON 文件并显示

在静态 json 文件上的 Node js 上使用 getJSON 时不支持获取协议

jQuery的getjson问题 用getjson获取一个文本文件 代码和症状如下

$.getJSON 执行问题:json 到数组已填充但未使用

尝试使用 json 文件和 Getjson 用 img src 填充 <li>

在 $.getJSON 中使用 $.each()