JSON 데이터를 HTML 테이블에 저장하는 방법은 무엇입니까?

-3

API를 사용하여 프로젝트의 데이터를 가져 와서 HTML 테이블에서 사용하려고합니다. API 호출 :JSON 데이터를 HTML 테이블에 저장하는 방법은 무엇입니까?

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

데이터는 변수 leagueTable에 저장됩니다. 데이터를 사용하여 API 호출에서 수신 한 정보가있는 테이블을 표시하려고합니다. Javascript를 사용하면 어떻게 될까요?

출처

2017-11-29 Jkan282

이미 테이블 템플릿에 html 코드가 있습니까? 더 구체적으로 대답하려고 시도해보십시오. –

체크 아웃 : https : //stackoverflow.com/questions/31074532/using-jquery-to-build-table-rows-from-ajax-response-not-with-static-json-data –

JSON 데이터를 반복하여 테이블 행 ("")을 HTML 테이블에 추가 할 수 있지만 @ArthurCantarela가 말한 것처럼 ... 코드가 이미 있으면 게시하여주십시오. – Ph0b0x

@ Möre 여기에 제가 제안하려고했던 접근 방식에 대한보다 자세한 답변이 있습니다.

당신은 다음과 같은 JSON 형식의 데이터를 포함하는 문자열이있는 경우 :

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

는 그런 다음 JSON.parse를 사용하여 JSON 개체 (에 해당 문자열을 변환 할 수 있습니다)이 같은 :

var jsonData = JSON.parse(jsonStringData);

을

그런 다음 데이터를 통해 루프와 같은 테이블을 채우기 :

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

을 나는 엑사을 넣어 너를 위해 JS 피들을 섞는다 here. 희망이 내 제안을 명확하게하고 당신이해야 할 일을 달성하는 데 도움이되기를 바랍니다.

출처

2017-11-30 13:03:25 Ph0b0x

다음은 @ Jkan282 API 호출을 사용하는 예제입니다. https ://jsfiddle.net/pb1hxexL/6/ – Ph0b0x

JSON 데이터를 HTML 테이블에 저장하는 방법은 무엇입니까?

답변

관련 문제