首頁 > web前端 > js教程 > 主體

如何從 JavaScript 中的 JSON 回應中提取資料?

Barbara Streisand
發布: 2024-10-28 03:32:02
原創
421 人瀏覽過

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中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!