控制台数据
<!DOCTYPE html>
<!-- saved from url=(0243)file:///C:/Users/%E5%B0%8F%E5%9B%9B/Documents/WeChat%20Files/wxid_sekc1lcyarn422/FileStorage/File/2022-03/%E5%A1%94%E9%87%8C%E6%9C%A8%E8%81%8C%E4%B8%9A%E6%8A%80%E6%9C%AF%E5%AD%A6%E9%99%A2%E5%AD%A6%E7%94%9F%E6%88%90%E7%BB%A9%E5%8D%95(1)(1).html -->
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h4>塔里木职业技术学院学生成绩单</h4>
<ul class="ulDom">
</ul>
<table cellpadding="0" cellspacing="0" class="Ltable" border="1" style="text-align: center;">
</table>
<!-- <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> -->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
<script>
function callback(data){
var data = data.data
var ulData = ""
ulData = `<li><span>姓名:</span>${data.ClassName}</li><li><span>学号:</span>${data.StuNo}</li><li><span>专业:</span>${data.MajorName}</li><li><span>班级:</span>${data.ClassName}</li>`
$(".ulDom").html(ulData)
var tableDom = "<table cellpadding='0' cellspacing='0'><tr><td>学年</td><td>学期</td><td>科目类型</td> <td>科目</td> <td>学分</td><td>成绩</td> <td>第一次补考成绩</td><td>第二次补考成绩</td></tr>";
var trDom = "";
var tdDom = "";
// 学年
for (var j = 0; j < data.ScoreList.length; j++) {
var rowNum = data.ScoreList[j].StuScoreEntityList.length
console.log("rowNum", rowNum)
// 学期
for (var i = 0; i < data.ScoreList[j].StuScoreEntityList.length; i++) {
trDom += '<tr>'
tdDom = ""
if (i == 0) {
tdDom += `<td rowspan='${rowNum}'> ${data.ScoreList[j].AcademicYearNo}</td><td rowspan='${rowNum}'>第${data.ScoreList[j].Semester}学期</td>`
}
tdDom += `<td> ${data.ScoreList[j].StuScoreEntityList[i].LessonSortName}</td><td> ${data.ScoreList[j].StuScoreEntityList[i].LessonName}</td><td> ${data.ScoreList[j].StuScoreEntityList[i].StudyScore}</td><td> ${data.ScoreList[j].StuScoreEntityList[i].Score}</td><td> ${data.ScoreList[j].StuScoreEntityList[i].ScoreOfNotPass}</td><td> ${data.ScoreList[j].StuScoreEntityList[i].ScoreOfNotPassTwo}</td>`
trDom += tdDom + "</tr>";
}
}
tableDom += trDom + "</table>";
$(".Ltable").html(tableDom);
}
</script>
//本地json数据
<script src="train.json?callback=callback"></script>
</body>
</html>
// train.json
会报错但是可以用
可自行添加数据
callback(
{
"code": 200,
"info": "响应成功",
"data": {
"StuNo": "2020020227",
"StuName": "热依汉古丽·阿卜力米提",
"MajorNo": "302",
"MajorName": "机电一体化技术",
"ClassNo": "2030102",
"ClassName": "20机电2班",
"ScoreList": [
{
"AcademicYearNo": "21-22",
"Semester": "1",
"StuScoreEntityList": [
{
"AcademicYearNo": "21-22",
"Semester": "1",
"LessonNo": "4603011003",
"LessonName": "马克思主义哲学原理(机电一体化技术)",
"StudyScore": null,
"Score": 67,
"ScoreOfNotPass": null,
"ScoreOfNotPassTwo": null,
"LessonSortName": "必修课"
},
]
},
]
}
}
)