Como llamar al texto de un input, por su id?

[patilanz]

Hola, bienvenido al foro :)

No te funciona por 2 razones.

El script se encuentra en la parte superior de la pagina por lo tanto se carga antes de los input y al asignarlos a las 3 variables se asigna undefined ya que no existen todabia.
para solucionar esto puedes poner el tag <script> al final o puedes usar.

Código Javascript:

<script>
window.onload=function(){
//Codigo javascript
 
}
</script>
 

Con esto ejecutas el script despues de que la pagina ha sido cargada.

Esto no va a hacer que funcione porque tu asignas los nodos html los inputs como tales y no su contenido. Tienes que cambiar lo por:

Código Javascript:

var alto = document.getElementById('alto').value;
var ancho = document.getElementById('ancho').value;
var largo = document.getElementById('largo').value;
 

El atributo value contiene el valor del input en text.

Tambien seria mejor que pongas la definicion de las variables dentro de la funcion calcular para que no sean globales.

Asi funciona:

Código Javascript:

function calcular()
{
var alto = document.getElementById('alto').value;
var ancho = document.getElementById('ancho').value;
var largo = document.getElementById('largo').value;
 
var area1 = ancho * alto;
var area2 = area1;
var area3 = largo * alto;
var area4 = area3;
var area5 = ancho * largo;
var metros2 = area1 + area2 + area3 + area4 + area5;
 
alert('La superficio a pintar son: ' + metros2 + ' m2');
}
 

Saludos