2

El código siguiente solicita 3 notas parciales mediante un formulario. Mediante un evento onclick la función calcularMedia() debería registrar los tres valores, convertirlos en entero, calcular la media y finalmente esta debería aparecer en pantalla.

function calcularMedia(){
    let notaMedia;
    document.getElementById("nota1").value;
    document.getElementById("nota2").value;
    document.getElementById("nota3").value;

    notaMedia = (Number(nota1) + Number(nota2) + Number(nota3))/3;
    
}
document.getElementById("media").innerHTML = "La nota media es= " + notaMedia;
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>NOTA MEDIA</title>
</head>
<body>
    
    <div><input id="nota1" type="text" placeholder="1er parcial"></div>
    <div><input id="nota2" type="text" placeholder="2do parcial"></div>
    <div><input id="nota3" type="text" placeholder="3er parcial"></div>
    
    <div><input type="button" onclick="calcularMedia()" value="Calcula la media"></div>
    
    <p id="media"></p>

</body>
</html>

Me surgen dos dudas:

  1. ¿Por qué no muestra por pantalla el resultado?
  2. Tiene algo que ver que la función, además de calcular la media, también esté registrando los valores de entrada? He probado en un IDE, pero no corrige el error.
0

2 respuestas 2

2

Buen día,

En el script te hace falta declarar variables para nota1, nota2 y nota3. Ademas, al ejecutar document.getElementById().value te va a devolver un string, debes convertirlo a valor numérico, como deseas convertirlos a entero puedes usar parseInt()

Esta parte quedaría así:

let nota1 = parseInt(document.getElementById("nota1").value, 10);
let nota2 = parseInt(document.getElementById("nota2").value, 10);
let nota3 = parseInt(document.getElementById("nota3").value, 10);

Para mostrar el resultado al hacer el click también debes escribir la última línea dentro de tu función calcularMedia

El código completo queda así:

function calcularMedia(){
    let notaMedia;
    let nota1 = parseInt(document.getElementById("nota1").value, 10);
    let nota2 = parseInt(document.getElementById("nota2").value, 10);
    let nota3 = parseInt(document.getElementById("nota3").value, 10);
    
    
    notaMedia = (var1 + var2 + var3)/3;

    document.getElementById("media").innerHTML = "La nota media es= " + notaMedia.toString();
}
2
  • El string, ¿lo obtengo por usar el document.getElementById().value o por que los datos entran a través de un <input>? el 26 ene. 2022 a las 8:21
  • 1
    Buen día, es por document.getElementById("nota1").value devuelve string, pero hay otra forma de obtener un valor numérico, puedes hacerlo utilizando el signo + de esta forma: +document.getElementById("nota1").value el 26 ene. 2022 a las 8:25
2

Hola bro primero que todo no le das un valor a tu variable "notaMedia", luego no estas guardando los valores en variables, y por ultimo la variable "notaMedia" solo esta definida dentro de la funcion. Para solucionar esto haz todo en la misma funcion de la siguiente manera.

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>NOTA MEDIA</title>
    </head>
    <body>
        
        <div><input id="nota1" type="text" placeholder="1er parcial"></div>
        <div><input id="nota2" type="text" placeholder="2do parcial"></div>
        <div><input id="nota3" type="text" placeholder="3er parcial"></div>
        
        <div><input type="button" onclick="calcularMedia()" value="Calcula la media"></div>
        
        <p id="media"></p>

    <script type="text/javascript">
        function calcularMedia(){
            //Definir variables
            let notaMedia = '';
            //Capturar valores 
            let nota1 = document.getElementById("nota1").value;
            let nota2 = document.getElementById("nota2").value;
            let nota3 = document.getElementById("nota3").value;
            //Calcular media
            notaMedia = (Number(nota1) + Number(nota2) + Number(nota3))/3;
            //Mostrar Media
            document.getElementById("media").innerHTML = "La nota media es= " + notaMedia;
        }
        
    </script>
    </body>
</html>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.