Necesito crear un calificador que califique a los estudiantes en su calificación promedio 'A, B', etc., pero tengo problemas para enviar la calificación a la página web. Solo lo necesito para mostrar la calificación, funciona en la consola, pero no conozco la función correcta para mostrar en la página web o mi código es incorrecto.
aquí está el código
javascript
var result = ''; const grade = document.getElementById('myGrades') const myJSTestResults = [40, 15, 55, 70, 80]; const average = (40 + 15 + 55 + 70 + 80)/5; function jsGrades() { if (average <= 100 && average >= 80) { result = console.log(`A`); }else if (average <= 79 && average >= 70){ result = console.log('B'); }else if (average <= 69 && average >= 60){ result = console.log('C'); }else if (average <= 59 && average >= 50){ result = console.log('D'); }else { result = console.log('F'); } jsGrades(); grade.innerHTML += ` <div> <h1>${result}</h1> </div> ` }html
<!DOCTYPE html> <html> <head> </head> <body onload="loadContent()"> <h1>My favourite languages:</h1> <ul id="favLanguages"></ul> <br> <div id="myGrades"> <button onclick="myGrades()">Grade</button> </div> <script src="./arraytask.js"></script> </body> </html>debe eliminar console.log y asignar el valor directamente a la variable de result .
const grade = document.getElementById('myGrades') const myJSTestResults = [40, 15, 55, 70, 80]; // Can also use reduce here to calculate the sum of results const sum = myJSTestResults.reduce((prev, next) => prev += next, 0) const average = sum / myJSTestResults.length; function jsGrades() { let result = 'F'; if (average <= 100 && average >= 80) { result = 'A'; } else if (average <= 79 && average >= 70) { result = 'B'; } else if (average <= 69 && average >= 60) { result = 'C'; } else if (average <= 59 && average >= 50) { result = 'D'; } return result } function myGrades() { const result = jsGrades(); grade.innerHTML += ` <div> <h1>${result}</h1> </div> ` } <!DOCTYPE html> <html> <head> </head> <body> <h1>My favourite languages:</h1> <ul id="favLanguages"></ul> <br> <div id="myGrades"> <button onclick="myGrades()">Grade</button> </div> <script src="./arraytask.js"></script> </body> </html>var result = ''; const grade = document.getElementById('myGrades') const myJSTestResults = [40, 15, 55, 70, 80]; const average = (40 + 15 + 55 + 70 + 80)/5; function jsGrades() { if (average <= 100 && average >= 80) { result = "A"; }else if (average <= 79 && average >= 70){ result = "B"; }else if (average <= 69 && average >= 60){ result = "C"; }else if (average <= 59 && average >= 50){ result ="D"; }else { result = "F"; } console.log(result); document.getElementById("result").innerHTML = result; }luego haga un div para mostrar el resultado después del clic
<div id="result"></div>Solo hago que el código sea más limpio para entenderlo mejor.
var result = ''; const myJSTestResults = [40, 15, 55, 70, 80]; const average = (40 + 15 + 55 + 70 + 80)/5; Number.prototype.between = function(max, min) { return this > min && this < max; }; function jsGrades() { if (average.between(100, 80)) { result = 'A' }else if (average.between(79, 70)){ result = 'B' }else if (average.between(69, 60)){ result = 'C' }else if (average.between(59, 50)){ result = 'D' }else { result = 'F' } return result; } function myGrades() { document.getElementById('result').innerHTML = jsGrades(); } <button onclick="myGrades()">Grade</button> <div id="result"></div>También puede lograr verificar el número entre el rango usando lodash _.inRange