javascript - 解析网站中的 JSON 数据

Question

由于我对 javascript 比较陌生，所以我有很多问题。我开始编写这个应用程序，让用户从雅虎财经网络服务获取股票信息并将其显示在网站上。听起来很容易吧？我也是这么想的，但我很难操纵我得到的数据。也许有人可以帮助我完成这项工作。我觉得我已经很接近这一点了。

用户在 stockTextBox 中输入他们选择的股票，例如 AAPL 或 GOOG。然后我设置了一个带有串联的脚本属性。现在，confirm() 行非常奇怪。如果我没有确认，函数 myCallBack 中的警报似乎不会执行。我根本无法解释这一点。也许我现在没有做一些我应该做的事情。

现在，如果我进行调试，我可以知道股票信息是从网站返回的。首先是代码，然后是 JSON 数据。如果有人能帮助我让这件事发挥作用，我将真诚地感激。我已经摆弄它几个小时了。谢谢你!换句话说，我的问题是如何将从网络服务获取的数据显示到我的网页上？

<form id="stockInput">
Stock Name: <input type="text" id="stockTextBox">
<input type="submit" id="submitButton" value="Submit">
</form>
</b>
<label id="stockLabel"></label>
<script>

var submitButton = document.getElementById("submitButton");
submitButton.addEventListener('click', actionPerformed, false);

function actionPerformed(e)
{

        var textValue = document.getElementById("stockTextBox").value;

        //tried to put to an element and then read the element value down below through concatenation in the src...
    //document.getElementById("stockLabel").innerHTML = textValue;

    var script = document.createElement('script');
    script.setAttribute('src',"http://finance.yahoo.com/webservice/v1/symbols/"+textValue+"/quote?format=json&callback=myCallBack");
    document.body.appendChild(script);
    confirm(); //ODD POINT...


 }
 function myCallBack(data)
 {
   alert("HEY" + data);

   //What I thought I would do. This doesn't output the right info.
   //for(key in data)
   //{

    //alert(data[key]);
   //}



 }

</script>
</body>
</html>

现在这是我可以通过 Firefox 在调试器中看到的 JSON:

myCallBack({
    "list": {
        "meta": {
            "type": "resource-list",
                "start": 0,
                "count": 1
        },
            "resources": [{
            "resource": {
                "classname": "Quote",
                    "fields": {
                    "name": "Google Inc.",
                        "price": "1030.579956",
                        "symbol": "GOOG",
                        "ts": "1383249600",
                        "type": "equity",
                        "utctime": "2013-10-31T20:00:00+0000",
                        "volume": "1640035"
                }
            }
        }

        ]
    }
});

Answer 1

您只能看到 [object]，因为它正在显示数据类型。您需要获取对象属性才能获取数据。 JSON 数据可以通过 JavaScript 轻松访问，因为 JSON 代表 JavaScript 对象表示法。

一旦开始，就非常简单，因为数据基本上由具有属性的对象和对象列表组成。变量数据是您的根对象，您可以轻松访问其下面的所有内容。

我将提供一些示例，说明如何访问数据中的某些内容:

属性“名称”:

alert(data.list.resources[0].resource.fields.name);

属性“类名”:

alert(data.list.resources[0].resource.classname);

它只是 Javascript 对象的文本表示。 “resources”是一个对象列表，“list”是一个对象，“fields”是一个对象，“price”是一个用于存储数据的键/值对。

在此处了解更多信息:http://www.json.org/ http://www.w3schools.com/json/

如果我误解了这个问题，请告诉我，我尝试了一下我认为你的意思。