"use strict"; // Present data of an array on a table const players = [ { name: "Donald", score: 100 }, { name: "Boris", score: 200 }, { name: "Xi", score: 300 }, { name: "Putin", score: 400 }, { name: "r2d2", score: 500 }, ]; /** * @function fetchApi * @description Fetch rest api from callback * @param {endpoint}. api endpoint url * @returns null * @author calvin * @copyright C1R2D2 2019 */ function fetchApi(endpoint) { axios.get(endpoint) // api to fetch .then(function (response) { // handle success arrayToTable(response.data) console.log(JSON.stringify(response)); }) .catch(function (error) { // handle error const retry = confirm('Please check your internet connection. Retry?'); // if(retry) setApiGetCount(g=>g+1); console.log("Error: " + error); }) .finally(function () { }); } /** * @function arrayToTable * @description Build a table based on input array * @param {arr}. Array with element objects {name, score} * @returns null * @author calvin * @copyright C1R2D2 2019 */ function arrayToTable(arr) { const container = document.getElementById("container"); const table = document.createElement('table'); //

arr.forEach(function(player) { const trs = document.createElement("tr"); // const td1 = document.createElement("td"); // const text1 = document.createTextNode(player.id); td1.appendChild(text1); // {text1} trs.appendChild(td1); // {text1} const td2 = document.createElement("td");// const text2 = document.createTextNode(player.who); td2.appendChild(text2); // {text2} trs.appendChild(td2); // // {text1} // {text2} // const td3 = document.createElement("td");// const text3 = document.createTextNode(player.target); td3.appendChild(text3); // {text2} trs.appendChild(td3); // // {text1} // {text2} // {text3} // table.appendChild(trs); // // // // // // //

{text1}

{text2}

{text3}

}); container.appendChild(table); //

// // // // // // // // // // // // : // : //

{text1}	{text2}	{text3}
{text1}	{text2}	{text3}

} onload = fetchApi.bind(this,'https://slloves.glitch.me/loves');

Get restapi to table