JavaScript แสดงผลเกรด และตัดเกรด

สอนภาษา JavaScript แสดงผลเกรด และตัดเกรด โดยรับคะแนนจากผู้ใช้งาน และนำคะแนนดังกล่าวมาตัดเกรด และแสดงผลเกรดออกสู่หน้าเว็บไซต์ สามารถเขียนโปรแกรมได้ดังนี้

ตัวอย่าง JavaScript แสดงผลเกรด และตัดเกรด

<input type="text" id="score"> <input type="button" value="แสดงผลเกรด" onclick="showGrade()"><br/>
<div id="div"></div>

<script>
    function showGrade() {
        var score = document.getElementById("score").value;
        var div = document.getElementById("div");
        var result = "คะแนน คือ "+score+" ได้เกรด ";

        if( score >= 90 ) {
            result += "A";
        } else if( score >= 80 ) {
            result += "B";
        } else if( score >= 70 ) {
            result += "C";
        } else if( score >= 60 ) {
            result += "D";
        } else {
            result += "E";
        }

        div.innerHTML = result;
    }
</script>

ผลลัพธ์

1. สร้างช่องกรอก และปุ่มกด โดยกำหนด id ให้กับช่องกรอก หรือ TextBox ด้วย score

2. สร้างฟังก์ชันชื่อ showGrade สำหรับแสดงผลเกรด และตัดเกรด

3. ใช้คำสั่ง if - else ในการตัดเกรด

4. ใช้คำสั่ง innerHTML ในการแสดงผลเกรดบนหน้าเว็บไซต์