我目前正在接收JSON数据,并希望使用javascript和html将其格式化为表格。 任何帮助表示赞赏。
获取请求后收到的JSON数据如下:
{
"results": [
{
"studentId": "Damien.Hammes93","score": 0.778678577215454
},{
"studentId": "Beverly56","score": 0.7879353094963757
},{
"studentId": "Tyshawn37","score": 0.723347659626473
},]
}
这是我希望表格格式化的方式:
<table>
<tr>
<th>Student ID</th>
<th>Grade</th>
</tr>
<tr>
<td>Damien.Hammes93</td>
<td>0.778678577215454</td>
</tr>
<tr>
<td>Beverly56</td>
<td>0.7879353094963757</td>
</tr>
<tr>
<td>Tyshawn37</td>
<td>0.723347659626473</td>
</tr>
</table>
这是我的代码当前的外观:
window.addEventListener('load',async() => {
const studentsTabletag = document.getElementById("studentsTable");
// studentsTabletag selects the student <table>
const studentsData = await receivesExamOrStudentData(enpoints['students']);
//studentsData returns the students JSON listed above
const studentsTable = (ele) => {
let html = `<table><tr>`;
html += `<td id="studentID" > ${ele} </td>`;
html += `</tr></table>`;
return html
}
const htmlStudents = studentsData.map(student =>
`<tr>${studentsTable(student)}</tr>`
).join('')
studentsTabletag.innerHTML = htmlStudents
})