有一个学员成绩json数组如下,要求以表格方式显示学员成绩表。 let scores = [ {"sid":1,"name":"岳不群","chinese":66,"maths":78}, {"sid":1,"name":"风清扬","chinese":86,"maths":65}, {"sid":1,"name":"东方不败","chinese":95,"maths":88}, {"sid":1,"name":"布袋和尚","chinese":36,"maths":69}, {"sid":1,
时间: 2023-06-28 10:06:42 浏览: 58
可以使用HTML和JavaScript来实现这个需求。以下是代码示例:
HTML代码:
```html
<table>
<thead>
<tr>
<th>学号</th>
<th>姓名</th>
<th>语文</th>
<th>数学</th>
<th>总分</th>
<th>平均分</th>
</tr>
</thead>
<tbody id="score-table-body">
</tbody>
</table>
```
JavaScript代码:
```javascript
let scores = [
{"sid":1,"name":"岳不群","chinese":66,"maths":78},
{"sid":2,"name":"风清扬","chinese":86,"maths":65},
{"sid":3,"name":"东方不败","chinese":95,"maths":88},
{"sid":4,"name":"布袋和尚","chinese":36,"maths":69},
{"sid":5,"name":"逍遥子","chinese":78,"maths":92}
];
let tableBody = document.getElementById("score-table-body");
scores.forEach(function(score) {
let tr = document.createElement("tr");
let totalScore = score.chinese + score.maths;
let averageScore = totalScore / 2;
tr.innerHTML = `
<td>${score.sid}</td>
<td>${score.name}</td>
<td>${score.chinese}</td>
<td>${score.maths}</td>
<td>${totalScore}</td>
<td>${averageScore.toFixed(1)}</td>
`;
tableBody.appendChild(tr);
});
```
运行代码后,会在网页上生成一个表格,显示学员的学号、姓名、语文成绩、数学成绩、总分和平均分。