将数据附加到HTML文件中

时间:2019-12-10 16:06:34

标签: javascript html json api

我希望将内部npm api中显示的数据附加到html文件中。将数据附加到html文件中的最佳方法是什么?

包括橄榄球数据npm包

var data = require("footballdata-api-v2");
var FootballData = data.default;   
var footballData = new FootballData("API-Key");

从api包中获取团队信息数据

footballData.getTeamsFromCompetition({
    competitionId: 2021  
})
    .then(function(data) {
        // Logs information from api in console
        console.log(JSON.stringify(data.teams, null, 4));
        var { teams: [{ table: tableData }] } = data;
        document.getElementById("output").innerHTML += rowDataHTML;
    });

1 个答案:

答案 0 :(得分:0)

假设rowDataHtml是要附加到#output元素(我假设它是一个表)的元素,则可以尝试如下操作:

const {teams} = data;
count output = document.getElementById("output");

teams.forEach(({table: tableData}) => {
    const rowDataHtml = `
        <tr>
            <td>${tableData.name}</td>
            <td>${tableData.league}</td>
            <td>${tableData.country}</td>
            <td>${tableData.score}</td>
        </tr>
    `;

    output.innerHTML += rowDataHTML;
});