Wie extrahiere ich Daten aus einer JSON-Antwort in JavaScript?

So analysieren Sie JSON-Antworten von einer URL in JavaScript

Viele Webdienste stellen ihre Antworten im JSON-Format bereit, sodass sie problemlos in JavaScript-Anwendungen integriert werden können. Der Zugriff auf Daten aus einer JSON-Antwort kann jedoch für Anfänger eine Herausforderung sein.

Betrachten Sie diese Beispiel-URL:

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

Diese URL gibt eine JSON-Antwort zurück, die wie folgt strukturiert ist:

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

Um diese JSON-Antwort zu analysieren und ein JavaScript-Objekt zu erstellen, stehen mehrere Optionen zur Verfügung.

Verwendung der .getJSON()-Funktion von jQuery

jQuery bietet eine praktische Funktion namens .getJSON() zum Abrufen JSON-Daten von einer URL. Durch Angabe der URL und einer Rückruffunktion können Sie die Antwort verarbeiten:

$.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
});

Verwendung von reinem JavaScript

Eine Alternative zu jQuery ist die Verwendung von reinem JavaScript zur Verarbeitung der JSON-Antwort. Das XMLHttpRequest-Objekt kann verwendet werden, um eine GET-Anfrage an die URL zu stellen:

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
    }
};

Das obige ist der detaillierte Inhalt vonWie extrahiere ich Daten aus einer JSON-Antwort in JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!