首页  >  文章  >  web前端  >  如何从 JavaScript 中的 JSON 响应中提取数据?

如何从 JavaScript 中的 JSON 响应中提取数据?

Barbara Streisand
Barbara Streisand原创
2024-10-28 03:32:02422浏览

How to extract data from a JSON response in JavaScript?

如何从 JavaScript 中的 URL 解析 JSON 响应

许多 Web 服务以 JSON 格式提供响应,使它们可以轻松地与 JavaScript 应用程序集成。但是,从 JSON 响应访问数据对于初学者来说可能具有挑战性。

考虑以下示例 URL:

http://query.yahooapis.com/v1/publ...

此 URL 返回结构如下的 JSON 响应:

{
  query: {
    count: 1,
    created: "2015-12-09T17:12:09Z",
    lang: "en-US",
    diagnostics: {},
    ...
  }
}

要解析此 JSON 响应并创建 JavaScript 对象,可以使用多种选项。

使用 jQuery 的 .getJSON() 函数

jQuery 提供了一个名为 .getJSON() 的便捷函数来进行获取来自 URL 的 JSON 数据。通过指定 URL 和回调函数,您可以处理响应:

$.getJSON('http://query.yahooapis.com/v1/public/yql?q=select%20%2a%20from%20yahoo.finance.quotes%20WHERE%20symbol%3D%27WRC%27&format=json&diagnostics=true&env=store://datatables.org/alltableswithkeys&callback', function(data) {
    // JSON result in `data` variable
});

使用纯 JavaScript

jQuery 的替代方法是使用纯 JavaScript 来处理 JSON 响应。 XMLHttpRequest 对象可用于向 URL 发出 GET 请求:

var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://query.yahooapis.com/v1/public/yql?q=select%20%2a%20from%20yahoo.finance.quotes%20WHERE%20symbol%3D%27WRC%27&format=json&diagnostics=true&env=store://datatables.org/alltableswithkeys');
xhr.send();

xhr.onload = function() {
    if (xhr.status == 200) {
        var responseObj = JSON.parse(xhr.responseText);
        // JSON result in `responseObj` variable
    }
};

以上是如何从 JavaScript 中的 JSON 响应中提取数据?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn