ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript を使用して URL から JSON データを抽出する方法

JavaScript を使用して URL から JSON データを抽出する方法

Susan Sarandon
リリース: 2024-10-27 20:46:30
オリジナル
516 人が閲覧しました

How to Extract JSON Data from a URL Using JavaScript?

JavaScript を使用して URL から JSON データを取得する

この記事では、特定の URL から JSON データを抽出する問題について説明します。指定された URL は、次の形式で JSON を返します:

<code class="json">{
  query: {
    count: 1,
    created: "2015-12-09T17:12:09Z",
    lang: "en-US",
    diagnostics: {},
    ...
  }
}</code>
ログイン後にコピー

次のコードを使用して JSON オブジェクトにアクセスしようとしましたが、失敗しました:

<code class="js">responseObj = readJsonFromUrl('http://query.yahooapis.com/v1/publ...');
var count = responseObj.query.count;

console.log(count) // should be 1</code>
ログイン後にコピー

解決策:

URL の JSON 応答から JavaScript オブジェクトを取得するには、jQuery の .getJSON() 関数を利用できます:

<code class="js">$.getJSON('http://query.yahooapis.com/v1/public/yql?q=select%20%2a%20from%20yahoo.finance.quotes%20WHERE%20symbol%3D%27WRC%27&amp;format=json&amp;diagnostics=true&amp;env=store://datatables.org/alltableswithkeys&amp;callback', function(data) {
    // JSON result in `data` variable
});</code>
ログイン後にコピー

あるいは、純粋な JavaScript ソリューションの場合は、次の答えを検討してください:

<code class="js">// Create a new XMLHttpRequest object
var xhr = new XMLHttpRequest();

// Open a GET request to the specified URL
xhr.open('GET', 'http://query.yahooapis.com/v1/public/yql?q=select%20%2a%20from%20yahoo.finance.quotes%20WHERE%20symbol%3D%27WRC%27&amp;format=json&amp;diagnostics=true&amp;env=store://datatables.org/alltableswithkeys&amp;callback', true);

// Set the response type to JSON
xhr.responseType = 'json';

// Send the request
xhr.send();

// Handle the response
xhr.onload = function() {
    if (xhr.status === 200) {
        // The request was successful
        var data = xhr.response;

        // Access the JSON data as needed
        console.log(data.query.count);
    } else {
        // The request failed
        console.log('Error: ' + xhr.status);
    }
};</code>
ログイン後にコピー

以上がJavaScript を使用して URL から JSON データを抽出する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート