HTML 및 JavaScript를 사용하여 학생의 최종 성적을 계산하는 프로그램 만들기

이번 기회에 자바스크립트를 사용하여 학생의 최종 성적을 입력하는 코드나 프로그램을 공유합니다. 이전에 netbeans를 사용하여 학생의 최종 성적을 계산하는 프로그램에 대해서도 논의했습니다.


내가 논의한 것처럼 이 자바스크립트 학생 최종 학년 프로그램에서도 사용자가 이름, 결석, 과제, uts 및 uas를 입력할 여러 변수를 설정했습니다.




다음과 같이 계산된 값으로:


결석 : 14 = ((14/14)*0.1)*100 = 10%

작업 : 100 = 100*0.2 = 20%

UTS : 100 = 100*0.3 = 30%

UAS : 100 = 100*0.4 = 40%


따라서 전체 등급 값을 더하면 100 또는 100%가 됩니다.


이 프로그램을 양식으로 표시한 다음 onclick 이벤트 함수와 parseInt()를 사용하여 문자열 값을 변경합니다.

다음은 소스 코드입니다.

Javascript로 학생 최종 성적을 계산하는 프로그램


<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Hardifal.com</title>
  <style>
   body{
    background: rgb(2,0,36);
background: linear-gradient(to bottom, #0477c2 0%,rgba(0,212,255,1) 100%);
    text-align: center;
    margin: 10%;
   }
   p#grade_out{
    font-weight: bold;
   }
  </style>
 </head>
<body> 
 <div>
 <form action="#" id="myform">
  Nama <input type="text" id="nama_in"><br><br>
  Absen <input type="text" id="n1"><br><br>
  Tugas <input type="text" id="n2"><br><br>
  UTS <input type="text" id="n3"><br><br>
  UAS <input type="text" id="n4"><br><br>
  
  <input type="button" onclick="data()" value="simpan">
  <input type="reset" value="reset"><br><br>
<!-- output -->
  <p id="nama_out"></p>
  <p id="absen_out"></p>
  <p id="tugas_out"></p>
  <p id="uts_out"></p>
  <p id="uas_out"></p>
  <br><br>
  <p id="note"></p>
  <p id="ket_absen"></p>
  <p id="ket_tugas"></p>
  <p id="ket_uts"></p>
  <p id="ket_uas"></p>
  <p id="jumlah_out"></p>
  <br>
  <p id="grade_out"></p>
 </form>
 <br><br>
 <script>
function data(){
   var nama = document.getElementById('nama_in').value;
   var m1 = document.getElementById('n1').value;
   var m2 = document.getElementById('n2').value;
   var m3 = document.getElementById('n3').value;
   var m4 = document.getElementById('n4').value;
   absen = ((m1/14)*0.1)*100;
   tugas = 0.2*m2;
   uts = 0.3*m3;
   uas = 0.4*m4;
   jumlah = absen+tugas+uts+uas;
  var grade;
     if(jumlah >=80)
    {
    grade= "A" ;
    }
    else if (jumlah >=70)
    {
    grade= "B" ;
    }
    else if (jumlah >=59)
    {
    grade= "C" ;
    }
    else if (jumlah >=50)
    {
    grade= "D" ;
    }
    else
    {
    grade="E" ;
    }
/*output*/
   document.getElementById("nama_out").innerHTML="Nama : "+nama;
   document.getElementById("absen_out").innerHTML="Absen : "+m1;
   document.getElementById("tugas_out").innerHTML="Tugas : "+m2;
   document.getElementById("uts_out").innerHTML="UTS : "+m3;
   document.getElementById("uas_out").innerHTML="UAS : "+m4;
   document.getElementById("note").innerHTML="Note : ";
   document.getElementById("ket_absen").innerHTML="Absen 10% : "+absen;
   document.getElementById("ket_tugas").innerHTML="Tugas 20% : "+tugas;
   document.getElementById("ket_uts").innerHTML="Tugas 30% : "+uts;
   document.getElementById("ket_uas").innerHTML="Tugas 40% : "+uas;
   document.getElementById("jumlah_out").innerHTML="Jumlah : "+jumlah;
   document.getElementById("grade_out").innerHTML="Grade : "+grade;
  
}
 </script>
 </div>
</body>
</html>

결과 :

HTML 및 JavaScript를 사용하여 학생의 최종 성적을 계산하는 프로그램 만들기

이것은 프로그램이 자바스크립트로 학생의 최종 성적/GPA를 계산하도록 하는 쉬운 방법입니다.

none:

Related Articles