Wie setze ich JSON-Daten in die HTML-Tabelle?

Question

Ich verwende eine API, um Daten für ein Projekt zu erhalten, und möchte es in einer HTML-Tabelle verwenden. Der API-Aufruf:

$.ajax({ 
headers: { 'X-Auth-Token': '0930de7050d349ceae279be6fabdacd1' }, 
url: 'http://api.football-data.org/v1/competitions/445/leagueTable', 
dataType: 'json', 
type: 'GET', 
}).done(function(response) { 
// do something with the response, e.g. isolate the id of a linked resource 
var leagueTable = response['standing'] 
console.log(leagueTable); 
}); 

Die Daten werden in der Variablen ligetTable gespeichert. Ich möchte die Daten verwenden, um eine Tabelle mit den Informationen aus dem API-Aufruf darzustellen. Wie würde ich Javascript dazu verwenden?

Answer 1

@ Mörre hier ist eine detailliertere Antwort auf den Ansatz, den ich vorschlagen wollte.

Wenn Sie eine Zeichenfolge, die JSON-formatierte Daten wie folgt aus:

var jsonStringData = '[{ "Name":"John","LName":"Doe","Occupation":"Henchman" },{ "Name":"Jane","LName":"Doe","Occupation":"Priest" }, { "Name":"Steve","LName":"Rogers","Occupation":"Captain" }]'; 

Dann könnten Sie in der Lage sein, diese Zeichenfolge in ein JSON-Objekt zu konvertieren JSON.parse mit() wie folgt aus:

var jsonData = JSON.parse(jsonStringData); 

Dann Schleife die Daten durch und füllen Sie Ihre Tabelle wie folgt aus:

for (var i = 0; i < jsonData.length; i++) { 
    //Insert data into HTML table here... 
} 

habe ich eine Exa mple JS Fiddle für Sie here. Ich hoffe, dies hilft, meinen Vorschlag zu klären und zu erreichen, was Sie tun müssen.