There’s a lot of things you need to fix first:
number entrada =
- This does not exist. To declare a variable you have to use one of the three possibilities: var
, let
or const
.
entrada = document.getElementsByTagName("raio");
- The <input>
that you want to go get:
<input type="text" name="raio">
Is a label <input>
and not <raio>
, for this reason would not work with getElementsByTagName
. In addition this function returns a "list" with all inputs that play with the name passed, so you would have to indicate that you want the first with [0]
.
AreaEsf = entrada * entrada * 3.14;
- Assuming I made it to <input>
necessary, it is necessary to interpret its value with .value
and turn into a number with parseInt
before it is even used.
The search for BUTTON
is done twice without need:
var buttons = document.getElementById("BUTTON");
...
document.getElementById("BUTTON").onclick = function() {
Ending up only complicating the code.
There would be many other things to improve, but just changing those mistakes that I pointed out, and making the code as close to what I had would look like this:
var buttons = document.getElementById("BUTTON");
//getElementsByName em vez de ByTagName e a posição [0]
var entradaInput = document.getElementsByName("raio")[0];
buttons.onclick = function() { //utilizar o buttons de cima
//interpretar o valor do input com .value e transformar em numero com parseInt
var entrada = parseInt(entradaInput.value);
var AreaEsf = entrada * entrada * 3.14; //com var em vez de number
var VolEsf = (4/3) * 3.14 * entrada * entrada * entrada; //com var em vez de number
document.writeln(AreaEsf);
document.writeln(VolEsf);
}
Working example:
<!DOCTYPE html>
<html>
<head>
<title>area da esfera</title>
<meta charset="utf-8">
</head>
<style type="text/css">
label{
display: inline-block;
width: 200px;
text-align: right;
}
</style>
<body>
<label for="">Informe o raio</label><input type="text" name="raio">
<button id="BUTTON" name = "button">OK!</button><br>
<label for "" >Área</label><input type="text" name="area" id = "circunferencia" disabled="" /><br>
<label for "" >Volume</label><input type="text" name="circunferencia" id = "circunferencia" disabled="" /><br>
<script>
var buttons = document.getElementById("BUTTON");
//getElementsByName em vez de ByTagName e a posição [0]
var entradaInput = document.getElementsByName("raio")[0];
buttons.onclick = function() { //utilizar o buttons de cima
//interpretar o valor do input com .value e transformar em numero com parseInt
var entrada = parseInt(entradaInput.value);
var AreaEsf = entrada * entrada * 3.14; //com var em vez de number
var VolEsf = (4/3) * 3.14 * entrada * entrada * entrada; //com var em vez de number
document.writeln(AreaEsf);
document.writeln(VolEsf);
}
</script>
</body>
</html>