创建html文件,使用prompt方法,分别输入你的姓名,各课程成绩,计算出总分,平均分(保留两位小数),输出结果
时间: 2024-09-19 20:12:29 浏览: 41
创建HTML文件来实现这个功能通常需要结合JavaScript,因为HTML本身并不支持复杂的计算。下面是一个简单的示例,你可以在HTML文件中嵌入JavaScript代码来实现所需的功能:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>成绩计算器</title>
</head>
<body>
<h2>请输入您的信息:</h2>
<label for="name">姓名:</label>
<input type="text" id="name" placeholder="请输入姓名"><br><br>
<label for="course_scores">各科成绩(逗号分隔):</label>
<input type="text" id="course_scores" placeholder="如:数学50,语文75,英语85"><br><br>
<button onclick="calculate()">计算</button>
<div id="results"></div>
<script>
function calculate() {
const name = document.getElementById('name').value;
const scoresString = document.getElementById('course_scores').value;
let scores = scoresString.split(",").map(Number); // 将字符串转换为数组并解析为数字
if (scores.someisNaN()) { // 检查是否有非数字项
alert("请确保所有分数都是有效的数字!");
return;
}
const totalScore = scores.reduce((sum, score) => sum + score);
const averageScore = totalScore / scores.length.toFixed(2); // 计算平均分并保留两位小数
document.getElementById('results').innerHTML = `姓名: ${name}\n总分: ${totalScore}\n平均分: ${averageScore}`;
}
</script>
</body>
</html>
```
在这个例子中,用户在页面上输入姓名和各科目成绩,点击“计算”按钮后,JavaScript函数`calculate()`会被触发。它会获取用户的输入,并计算总分和平均分。结果会显示在页面上指定的元素中。