今天看到一份面試題,做了很久才做出來,由此記錄一下
1、題目:
使用JavaScript 設計一個程序, 使用者輸入的5門課程的成績後在頁面上顯示總成績和平均分, 並列出大於60的成績
2、代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Language" content="zh-cn"/>
<title></title>
</head>
<body>
課程1:<input type="text" id="kc1"/><br/>
課程2:<input type="text" id="kc2"/><br/>
課程3:<input type="text" id="kc3"/><br/>
課程4:<input type="text" id="kc4"/><br/>
課程5:<input type="text" id="kc5"/><br/>
<button id="btn" onclick="btn();">確定</button>
<div id="did"></div>
<script>
function btn() {
var kc1 = parseFloat(document.getElementById("kc1").value);
var kc2 = parseFloat(document.getElementById("kc2").value);
var kc3 = parseFloat(document.getElementById("kc3").value);
var kc4 = parseFloat(document.getElementById("kc4").value);
var kc5 = parseFloat(document.getElementById("kc5").value);
var div_id = document.getElementById("did");
if (kc1 >= 0 && kc2 >= 0 && kc3 >= 0 && kc4 >= 0 && kc5 >= 0) {
var total = kc1 + kc2 + kc3 + kc4 + kc5;
var svg = total / 5;
var json_obj = {"課程1": kc1, "課程2": kc2, "課程3": kc3, "課程4": kc4, "課程5": kc5};
var json_new = {};
for (var key in json_obj) {
if (json_obj[key] >= 60) {
json_new[key] = json_obj[key];
}
}
div_id.innerHTML = '總成績爲:' + total + '<br>平均成績爲:' + svg + '<br>高於60分的成績有:' + JSON.stringify(json_new);
} else {
alert("輸入有誤,請重新輸入");
}
}
</script>
</body>
</html>
3、運行後:
4、運行後: