There are several things you need to fix first:
-
number entrada =
- This does not exist. To declare a variable you have to use one of three possibilities: var
, let
or const
.
-
entrada = document.getElementsByTagName("raio");
- The <input>
you want to fetch:
<input type="text" name="raio">
It is a <input>
tag and not <raio>
, so it would not work with getElementsByTagName
. In addition this function returns a "list" with all the inputs that play with the last name, so you would have to indicate that you want the first with [0]
.
-
AreaEsf = entrada * entrada * 3.14;
- Assuming that it reaches% required%, it is necessary to interpret its value with <input>
and also transform it into number with .value
before even using it. li>
-
The search for parseInt
is done twice without need:
var buttons = document.getElementById("BUTTON");
...
document.getElementById("BUTTON").onclick = function() {
It ends up only complicating the code.
There would be many other things to improve, but only changing those errors that I indicated, and leaving the code as close to what it would look like:
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);
}
Example to work:
<!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>