有一个学员成绩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,"name":"令狐冲","chinese":76,"maths":74}, ]; 1)浏览器以表格形式显示: 学员成绩表<h2></h2> 学号 姓名 语文 数学 总分 .. .. .. .. .. 2)在浏览器中输出总分最高的学员姓名,语文和数学成绩 3)在浏览器中输出总分最低的学员姓名,语文和数学成绩 4)在浏览器中输出语文成绩最高的学员姓名 5)在浏览器输出数学成绩最高的的学员姓名
时间: 2023-06-28 22:06:46 浏览: 27
以下是实现该需求的代码:
```html
<!DOCTYPE html>
<html>
<head>
<title>学员成绩表</title>
</head>
<body>
<h2>学员成绩表</h2>
<table>
<thead>
<tr>
<th>学号</th>
<th>姓名</th>
<th>语文</th>
<th>数学</th>
<th>总分</th>
</tr>
</thead>
<tbody>
<script>
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":76,"maths":74},
];
let maxScore = 0;
let minScore = Infinity;
let maxChinese = 0;
let maxMaths = 0;
let maxChineseName = '';
let maxMathsName = '';
for(let i=0; i<scores.length; i++) {
let score = scores[i];
let totalScore = score.chinese + score.maths;
if(totalScore > maxScore) {
maxScore = totalScore;
maxName = score.name;
maxChinese = score.chinese;
maxMaths = score.maths;
}
if(totalScore < minScore) {
minScore = totalScore;
minName = score.name;
minChinese = score.chinese;
minMaths = score.maths;
}
if(score.chinese > maxChinese) {
maxChinese = score.chinese;
maxChineseName = score.name;
}
if(score.maths > maxMaths) {
maxMaths = score.maths;
maxMathsName = score.name;
}
document.write(`
<tr>
<td>${score.sid}</td>
<td>${score.name}</td>
<td>${score.chinese}</td>
<td>${score.maths}</td>
<td>${totalScore}</td>
</tr>
`);
}
</script>
</tbody>
</table>
<script>
document.write(`<p>总分最高的学员姓名:${maxName},语文成绩:${maxChinese},数学成绩:${maxMaths}</p>`);
document.write(`<p>总分最低的学员姓名:${minName},语文成绩:${minChinese},数学成绩:${minMaths}</p>`);
document.write(`<p>语文成绩最高的学员姓名:${maxChineseName}</p>`);
document.write(`<p>数学成绩最高的学员姓名:${maxMathsName}</p>`);
</script>
</body>
</html>
```
在浏览器中打开该页面,即可看到以表格形式显示学员成绩表,并输出各种成绩排名的结果。