Estou tentando capturar o valor do input e mandar para o script do js
, onde se a nota do aluno for >= 7
exibe na tag p
"Aprovado"
e caso contrario exibe "Reprovado"
, mas estou travado na lógica do js, não consigo exibir o resultado.
<!DOCTYPE html>
<html lang="pt-br">
<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>College FX</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');
</style>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container">
<header>
<h1>COLLEGE FX</h1>
</header>
<div class="formcontainer">
<p>Welcome student, this is your grading portal, together we will check if you pass or fail</p>
<form class="form" action="">
<input type="text" name="name" id="name" placeholder="enter you name">
<input type="number" name="note1" id="note1" placeholder="enter test grade 1">
<input type="number" name="note2" id="note2" placeholder="enter test grade 2">
<select class="city" value="college">
<option value="sp">São paulo</option>
<option value="sp">Toronto</option>
<option value="sp">New york</option>
<option value="sp">Sydney</option>
</select> <br>
<input onclick="" type="submit" value="Calcular" class="Calcular" id="btn">
<p id="result" class="r"> </p>
</form>
</div>
</div>
<script src="./script.js"></script>
let btn = document.querySelector("#btn")
btn.addEventListener("click",function(e){
e.preventDefault()
const n1 = document.querySelector("#note1").value
const value1 = n1.value
const n2 = document.querySelector("#note2").value
const value2 = n2.value
const media = parseInt((value1)) + parseInt((value2)) /2
if (media >=7){
document.getElementById("#result").innerHTML = "Aprovado"
} else{
document.getElementById("#result").innerHTML = "reprovado"
}
})
</body>
</html>