對(duì)之前的試卷進(jìn)行dom操作硫朦,實(shí)現(xiàn)必要字段提醒以及打分的功能。
實(shí)現(xiàn)步驟:
- 給文本框及選項(xiàng)加id
- 使用 document.getElementById獲取節(jié)點(diǎn)
- 在計(jì)分按鈕上添加onclick觸發(fā)事件,實(shí)現(xiàn)對(duì)必填信息以及答案的判斷
- 使用innerHTML方法改變節(jié)點(diǎn)內(nèi)容棋凳,添加最后總分
- 使用.style.borderColor方法改變文本框顏色
- 使用alert()彈出提示信息
- 使用checked屬性判斷radio及checkbox是否被選中
<script>
function check() {
var classNum = document.getElementById("1");
var snoNum = document.getElementById("2");
var nameNum = document.getElementById("3");
if (classNum.value === "" || snoNum.value === "" || nameNum.value === "") {
classNum.style.borderColor = "red";
snoNum.style.borderColor = "red";
nameNum.style.borderColor = "red";
alert("請(qǐng)檢查必填元素朝巫!")
}
else {
var grade = 0;
if (document.getElementById("answer1").value === "統(tǒng)一建模語言")
grade += 5;
if (document.getElementById("answer2").value === "封裝性")
grade += 5;
if (document.getElementById("answer3").value === "繼承性")
grade += 5;
if (document.getElementById("answer4").value === "多態(tài)性")
grade += 5;
if (document.getElementById("answer5").checked)
grade += 10;
if (document.getElementById("answer6").checked)
grade += 10;
if (document.getElementById("answer7").checked && document.getElementById("answer8").checked && document.getElementById("answer9").checked)
grade += 10;
if (document.getElementById("answer10").checked && document.getElementById("answer11").checked && document.getElementById("answer12").checked)
grade += 10;
if (document.getElementById("answer13").checked)
grade += 10;
if (document.getElementById("answer14").checked)
grade += 10;
if (document.getElementById("answer15").value === "模型是對(duì)現(xiàn)實(shí)世界的簡(jiǎn)化和抽象,模型是對(duì)所研究的系統(tǒng)番舆、過程酝碳、事物或概念的一種表達(dá)形式『薇罚可以是某種圖形疏哗;或者是一種數(shù)學(xué)表達(dá)式")
grade += 20;
document.getElementById("score").innerHTML = "得分:" + grade;
document.getElementById("score").innerHTML.style.color = "red";
}
}
</script>
必填信息提醒
必要信息提醒
得分