Hướng dẫn how to make grade calculator in javascript? - cách tạo máy tính điểm trong javascript?

Question

Xây dựng một máy tính lớp bằng JavaScript & NBSP ;.

Nội dung chính Show

Dưới đây là máy tính lớp học sinh sử dụng HTML, CSS & JS thuần túy. Ở định dạng web, bạn có thể nhập một số điểm trên một số môn học và bạn có thể nhận được tổng số điểm, tỷ lệ phần trăm và lớp học của học sinh
Mã nguồn:
MÃ HTML:
Tạo tệp CSS có tên là style.css để liên kết với kiểu dáng
Tạo tệp CSS có tên là style.css để liên kết với kiểu dáng
Tạo tệp CSS có tên là style.css để liên kết với kiểu dáng
Tạo một tệp javascript có tên là main.js
Hướng dẫn YouTube
Công thức lớp là gì?

Xin chào, bài viết này mô tả việc xây dựng một máy tính cấp bằng hàm JavaScript, nhiều câu lệnh IF và câu lệnh trả về để tính toán và hiển thị điểm của học sinh và lớp thu được, đồng thời hiển thị cách kết nối chuỗi hoạt động bằng toán tử bổ sung (+).

Bắt đầu nào.

Bước 1: Xác định hàm (GradecalCulator), đặt nó thành một hàm (đối số - điểm và tổng) và f {function body} Define a function ( gradeCalculator), set it to a function (arguments - score and total) and f
{ Function body }

Bước 2: Chúng tôi tính toán tỷ lệ phần trăm, như trong dòng 3 We calculate the percentage, as shown in line 3

Bước 3: Chúng tôi xác định lớp thư được gán cho các phạm vi điểm khác nhau. Chúng tôi sẽ làm điều này bằng cách sử dụng nhiều câu lệnh như được hiển thị giữa dòng 6 và dòng 15 We determine the letter grade to be assigned to different score ranges. We will do this by using multiple- IF- Statements as shown between line 6 and line 15

Bước 4: Chúng tôi trả về một thông báo hiển thị lớp chữ cái và điểm thu được bằng cách sử dụng câu lệnh trả về và sử dụng ký hiệu bổ sung (+) để tham gia các chuỗi như trong dòng 17. We return a message showing the letter grade and the score obtained using Return statement and the use of Addition symbol (+) to join the strings as shown in line 17.

Bước 5: Chúng tôi bắt đầu sử dụng chức năng của mình bằng cách gọi gradecalculator và sử dụng 80 làm điểm số của chúng tôi và 100 làm tổng số. Chúng tôi hiển thị kết quả của chúng tôi như được hiển thị bằng cách sử dụng Console.log. We start making use of our function by calling gradeCalculator and using 80 as our score and 100 as the total . We display our result as shown by using console.log.

Mã số

Đầu ra

Vâng! Máy tính lớp của chúng tôi đã sẵn sàng. Hy vọng bạn thích chính mình & nbsp;?.

Hướng dẫn how to make grade calculator in javascript? - cách tạo máy tính điểm trong javascript?

Dưới đây là máy tính lớp học sinh sử dụng HTML, CSS & JS thuần túy. Ở định dạng web, bạn có thể nhập một số điểm trên một số môn học và bạn có thể nhận được tổng số điểm, tỷ lệ phần trăm và lớp học của học sinh

Mã nguồn:

MÃ HTML:



 lang="en">


     rel="stylesheet" href="style.css">
     charset="UTF-8">
     name="viewport" content="width=device-width, initial-scale=1.0">
    </span>Glass Morphism Grade Calculator<span>




     class="calc-body">
         class="result">
            Result
             class="show">
                Total: id="total">
                

                Percentage: id="percentage">
                

                Grade: id="grade">



 class="inp">
 class="main">
 type="number" name="" id="math" placeholder="Math">

 type="number" name="" id="physics" placeholder="Physics">

 type="number" name="" id="chemistry" placeholder="Chemistry">

 type="number" name="" id="cprogramming" placeholder="C Programming">

 type="number" name="" id="computer" placeholder="Computer">

 onclick="getResult()">Calculate Result

Nhập chế độ FullScreenen EXIT Mode FullScreen

Tạo tệp CSS có tên là style.css để liên kết với kiểu dáng

Mã CSS:

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    font-family: monospace;
}
body{
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    display: flex;
    background: linear-gradient(217deg, rgba(255,0,0,.8), rgba(255,0,0,0) 70.71%),
    linear-gradient(127deg, rgba(0,255,0,.8), rgba(0,255,0,0) 70.71%),
    linear-gradient(336deg, rgba(0,0,255,.8), rgba(0,0,255,0) 70.71%);
}

.calc-body{
    background: radial-gradient(
        rgba(255, 255, 255, 0.09),
        rgba(255, 255, 255, 0.9)
      );    height: 50vh;
    width: 45vw;
    height: 70vh;
    border-radius: 20px;
}
.result{
    position: absolute;

    border-bottom-left-radius: 20px;
    border-top-left-radius: 20px;
    height: 70vh;
    width: 20vw;
    background: radial-gradient(
        rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.5)
    );
}
.result h2{
    font-size: 55px;
    margin: 40px 0;
    text-align: center;
}
h2{
    font-size: 35px;
    margin: 10px 30px;
}
.show{
    margin-top: 85px;
}
.inp{
    text-align: center;
    justify-content: center;
    align-items: center;
    width: 60vw;
    height: 70vh;
    display: flex;
}

input{
    font-weight: 880;
    border-radius: 10px;
    margin: 15px;
    height: 45px;
    padding: 20px;
    border: none;
    outline: none;
    font-size: 20px;
    border: 1px solid rgb(223, 217, 217);
    background: rgba(0, 0, 0, 0.05);
}

.main{
    margin-left: 45px;
}
button{
    margin-top: 20px;
    height: 45px;
    width: 200px;
    font-weight: 650;
    cursor: pointer;
    background: rgba(0, 0, 0, 0.05);
    border: 1px solid rgb(223, 217, 217);
    outline: none;
    font-size: 20px;
}

::placeholder{
    font-weight: 850;
}

Nhập chế độ FullScreenen EXIT Mode FullScreen

Tạo tệp CSS có tên là style.css để liên kết với kiểu dáng

Mã CSS:

const getResult = () => {
    let math = document.getElementById('math').value;
    let physics = document.getElementById('physics').value;
    let chemistry = document.getElementById('chemistry').value;
    let c = document.getElementById('cprogramming').value;
    let computer = document.getElementById('computer').value;

    if(document.getElementsByTagName('input').value==""){
        alert("Please Enter Some Value");
    }
    let total = parseFloat(math) + parseFloat(physics) + parseFloat(chemistry) + parseFloat(c) + parseFloat(computer);
    let percentage = (total * 100) / 500;

    if (percentage >= 90) {
        document.getElementById("grade").innerHTML = "A+";
    }
    else if (percentage >= 80) {
        document.getElementById("grade").innerHTML = "A";

    }
    else if (percentage >= 70) {
        document.getElementById("grade").innerHTML = "B+";

    }
    else if (percentage >= 60) {
        document.getElementById("grade").innerHTML = "B";

    }
    else if (percentage >= 50) {
        document.getElementById("grade").innerHTML = "B+";

    }
    else if (percentage >= 40) {
        document.getElementById("grade").innerHTML = "C+";

    }
    else if (percentage >= 30) {
        document.getElementById("grade").innerHTML = "C";

    }
    else if (percentage >= 20) {
        document.getElementById("grade").innerHTML = "D+";

    }
    else {
        document.getElementById("grade").innerHTML = "You Are Failed";

    }


    document.getElementById('percentage').innerHTML = percentage;
    document.getElementById('total').innerHTML = total;
}

Nhập chế độ FullScreenen EXIT Mode FullScreen

Tạo tệp CSS có tên là style.css để liên kết với kiểu dáng

Mã CSS:

Tạo một tệp javascript có tên là main.js

Mã JavaScript:
Youtube
Github

Hướng dẫn YouTube

JavaScript: Tính tỷ lệ phần trăm của một số..

Giải pháp mẫu:-.

Mã HTML:

Mã JavaScript: Tỷ lệ phần trăm hàm (num, per) {return (num/100)*per;} console.log (tỷ lệ phần trăm (1000, 47.12));....

Flowchart:.

Bản thử trực tiếp: ... .

Cải thiện giải pháp mẫu này và đăng mã của bạn thông qua Disqus ..

Công thức lớp là gì?

Để tính toán GPA, giá trị đơn vị cho mỗi khóa học trong đó một học sinh nhận được một trong các lớp trên được nhân với số điểm điểm cho lớp đó.Tổng của các sản phẩm này sau đó được chia cho tổng của các đơn vị.Điểm trung bình tích lũy là tổng của các điểm điểm chia cho tổng của các đơn vị.

programming javascript Tip calculator javascript Grade student Java

Hướng dẫn how to make grade calculator in javascript? - cách tạo máy tính điểm trong javascript?

Dưới đây là máy tính lớp học sinh sử dụng HTML, CSS & JS thuần túy. Ở định dạng web, bạn có thể nhập một số điểm trên một số môn học và bạn có thể nhận được tổng số điểm, tỷ lệ phần trăm và lớp học của học sinh

Mã nguồn:

MÃ HTML:

Result

Total: id="total">

Percentage: id="percentage">

Grade: id="grade">

Tạo tệp CSS có tên là style.css để liên kết với kiểu dáng

Mã CSS:

Tạo tệp CSS có tên là style.css để liên kết với kiểu dáng

Mã CSS:

Tạo tệp CSS có tên là style.css để liên kết với kiểu dáng

Mã CSS:

Tạo một tệp javascript có tên là main.js

Hướng dẫn YouTube

Công thức lớp là gì?

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội