在html运行的 将function handIn() { var total = 0; //遍历答题卡和答案 for (var i = 0; i < answers.length; i++) { if (answers[i].toLowerCase() === keys[i]) { total = total + Number(p[i].score); } }} alert('你的得分是:' + total);的total储存到localStorage的一个数组,并在html创建一个表格,点击一个查询将每次获取的total第几次total都显示出来的html和js代码
时间: 2024-03-20 07:44:41 浏览: 64
以下是将total存储到localStorage数组中并创建表格,并在点击查询按钮时显示每次得分的HTML和JS代码:
HTML代码:
```
<table id="scoreTable">
<thead>
<tr>
<th>序号</th>
<th>得分</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<button onclick="showScores()">查询得分</button>
```
JS代码:
```
function handIn() {
var total = 0;
//遍历答题卡和答案
for (var i = 0; i < answers.length; i++) {
if (answers[i].toLowerCase() === keys[i]) {
total = total + Number(p[i].score);
}
}
//将total存储到localStorage数组中
var scores = JSON.parse(localStorage.getItem('scores')) || [];
scores.push(total);
localStorage.setItem('scores', JSON.stringify(scores));
}
function showScores() {
var scores = JSON.parse(localStorage.getItem('scores')) || [];
var tableBody = document.querySelector('#scoreTable tbody');
//清空表格
tableBody.innerHTML = '';
//将每个得分添加到表格中
scores.forEach(function(score, index) {
var row = document.createElement('tr');
var indexCell = document.createElement('td');
var scoreCell = document.createElement('td');
indexCell.textContent = index + 1;
scoreCell.textContent = score;
row.appendChild(indexCell);
row.appendChild(scoreCell);
tableBody.appendChild(row);
});
}
```
在这个代码中,我们在`handIn()`函数中将每次得分存储到localStorage的`scores`数组中。在`showScores()`函数中,我们从localStorage中获取`scores`数组并将每个得分添加到表格中,并在表格中显示每次得分的序号。最后,我们在HTML中添加了一个按钮,点击按钮会调用`showScores()`函数展示所有的得分和序号。
阅读全文