使用 JavaScript 设计学生成绩计算器

学生成绩计算器 (SGC) 可用于根据学生的分数计算百分比。 (SGC) 是一个相当可靠的学生成绩指标。

公式：

percentage =  ( totalgrades / 400 ) *  100 ;

方法： SGC 是根据学生分数计算的百分比计算器。为了找出 SGC，我们将从存储在化学、印地语和数学变量中的用户（对于四个科目）获取输入以进行进一步计算。计算过程很简单，我们将简单的首先我们将所有输入的分数相加并将它们存储在总成绩变量中，然后我们将其除以每个科目的最高分数的总和。稍后我们将让另一个名为成绩的变量来存储成绩。现在根据计算的百分比，它将执行相应的 if-else 语句。结果中打印的是百分比和学生的成绩。使用 HTML，我们提供了所需的结构、输入选项和提交按钮。在 CSS 的帮助下，我们通过提供颜色和所需的字体等来美化我们的结构。在 JavaScript 部分，我们正在处理获取的输入，并在计算后打印相应的输出。

创建计算器的步骤：

• 首先，我们将创建一个名为calculate 的函数。
• 初始化所有变量并存储用户输入的值。
• 现在转换浮点数据类型的值。
• 然后我们使用简单的数学来进行计算。
• 然后我们实现了 if-else 条件。
• 然后我们检查空输入的条件，如果它不为空，那么我们将执行我们的输出。

示例：现在让我们开始实现学生成绩计算器。

index.html

  
    student calculate
    
    
    
  
  
    
    
      Student grade calculator
      
        
          
            
            
          
          
            
          
          
            
          
          
            
          
          
            
          
        
      
      
      
        
      
    
    
    
  

样式文件

样式文件

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  background: #006600;
  font-size: 12px;
}
  
.container {
  flex: 0 1 700px;
  margin: auto;
  padding: 10px;
}
  
.screen-body-item {
  flex: 1;
  padding: 50px;
}
input {
  margin: 10px 10px 10px;
}
.showdata {
  color: black;
  font-size: 1.2rem;
  padding-top: 10px;
  padding-bottom: 10px;
}

脚本.js

// Function for calculating grades
const calculate = () => {
  
  // Getting input from user into height variable.
  let chemistry = document.querySelector("#chemistry").value;
  let hindi = document.querySelector("#hindi").value;
  let maths = document.querySelector("#maths").value;
  let phy = document.querySelector("#phy").value;
  let grades = "";
  
  // Input is string so typecasting is necessary. */
  let totalgrades =
    parseFloat(chemistry) +
    parseFloat(hindi) +
    parseFloat(maths) +
    parseFloat(phy);
  
  // Checking the condition for the providing the 
  // grade to student based on percentage
  let percentage = (totalgrades / 400) * 100;
  if (percentage <= 100 && percentage >= 80) {
    grades = "A";
  } else if (percentage <= 79 && percentage >= 60) {
    grades = "B";
  } else if (percentage <= 59 && percentage >= 40) {
    grades = "C";
  } else {
    grades = "F";
  }
  // Checking the values are empty if empty than
  // show please fill them
  if (chemistry == "" || hindi == "" 
            || maths == "" || phy == "") {
    document.querySelector("#showdata").innerHTML
         = "Please enter all the fields";
  } else {
  
    // Checking the condition for the fail and pass
    if (percentage >= 39.5) {
      document.querySelector(
        "#showdata"
      ).innerHTML = 
        ` Out of 400 your total is  ${totalgrades} 
        and percentage is ${percentage}%. 
 
        Your grade is ${grades}. You are Pass. `;
    } else {
      document.querySelector(
        "#showdata"
      ).innerHTML = 
        ` Out of 400 your total is  ${totalgrades} 
        and percentage is ${percentage}%. 
 
        Your grade is ${grades}. You are Fail. `;
    }
  }
};

输出：