用js的外链式打印3*3的成绩单
时间: 2024-09-16 08:01:24 浏览: 33
mp3外链转换工具
在JavaScript中,你可以使用HTML的`<table>`元素以及一些基本的DOM操作来创建一个外链式的3x3成绩表。下面是一个简单的例子:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<title>3x3成绩单</title>
<style>
table {
border-collapse: collapse;
width: 100%;
}
th, td {
border: 1px solid black;
padding: 8px;
text-align: center;
}
th {
background-color: #f2f2f2;
}
tr:nth-child(even) {
background-color: #f2f2f2;
}
</style>
</head>
<body>
<table id="scoreTable">
<thead>
<tr>
<th>学号</th>
<th>语文</th>
<th>数学</th>
<!-- 添加其他科目列 -->
</tr>
</thead>
<tbody>
<!-- 使用JavaScript动态填充数据 -->
</tbody>
</table>
<script>
// 假设我们有成绩数据
let scores = [
{ studentID: 1, chinese: 90, math: 95 },
{ studentID: 2, chinese: 85, math: 92 },
// 添加更多学生数据...
];
for (let i = 0; i < 3; i++) {
let row = document.createElement('tr');
row.innerHTML = `
<td>${scores[i].studentID}</td>
<td>${scores[i].chinese}</td>
<td>${scores[i].math}</td>
`;
document.getElementById('scoreTable').getElementsByTagName('tbody')[0].appendChild(row);
}
</script>
</body>
</html>
```
在这个示例中,我们首先创建了一个表格结构,然后使用JavaScript动态生成了3行3列的数据。你可以将`scores`数组替换为你实际的成绩数据。
阅读全文