Untitled

<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8"/>

    <link href="bootstrap.min.css" rel="stylesheet">,

    <style type="text/css">
    h1{
        font-family: "Times New Roman Georgia", Times, serif;
    }
    </style>
</head>

<body>
    <h1> <b> Formulário de registro de notas </b> </h1>
    <hr size=20>

    <form>
        <fieldset>
            <label for="nome">Nome: </label>
            <input type="text" name="nome" id="nome">
            <br>
            <label for="n1">Nota1: </label>
            <input type="number" name="n1" id="n1">
            <br>
            <label for="n2">Nota2: </label>
            <input type="number" name="n2" id="n2">
            <br>
            <label for="n3">Nota3: </label>
            <input type="number" name="n3" id="n3">
            <br>
            <input type="button" value="calcular" id="somar">
            <hr>

        </fieldset>
    </form>
    <script src="jquery-3.2.1.js"></script>
    <script src="bootstrap.min.js"> </script>
    <script>

    var botao = document.querySelector("#somar");
    function calc(){
        if(document.querySelector("#nome").value == ''){
            alert("Voce esqueceu de fornecer seu nome");

        } else {

            var nota1 = document.querySelector("#n1").value;
            var nota2 = document.querySelector("#n2").value;
            var nota3 = document.querySelector("#n3").value;

            var soma = parseInt(nota1) + parseInt(nota2) + parseInt(nota3);
            console.log(soma); //usa isso pra debugar
            if ( soma > 60 ){
                document.write("Aprovado");

            } else {
                document.write("Reprovado");
            }

        }

    }

    botao.addEventListener('click',calc);
    </script>
</body>
</html>