anun1

lunes, 3 de marzo de 2025

Crear una simple calculadora en javascript y html

Hola amigos hoy les dejare un codigo de una calculadora muy simple no es la gran cosa pero es para entretenerse un rato, lo hice lo mas simple que pude y sencillo solo copean el codigo y lo pegan en el bloc de notas y le ponen la extencion html 

bueno aqui una imagen de ella


bueno aqui el codigo 

 
<html>
<head><title>Calculadora</title>
</head>
<body>
<marquee>Mi Calculadora</marquee>
<br><br><br><br>
<center>
<input type="text" value="" size="30" id="log" disabled><br><br>
<input type="button" value="1" onclick="num('1')" style="width:50;height:50;font-size:30;">
<input type="button" value="2" onclick="num('2')" style="width:50;height:50;font-size:30;">
<input type="button" value="3" onclick="num('3')" style="width:50;height:50;font-size:30;">
<input type="button" value="+" onclick="num('+')" style="width:50;height:50;font-size:30;"><br>

<input type="button" value="4" onclick="num('4')" style="width:50;height:50;font-size:30;">
<input type="button" value="5" onclick="num('5')" style="width:50;height:50;font-size:30;">
<input type="button" value="6" onclick="num('6')" style="width:50;height:50;font-size:30;">
<input type="button" value="-" onclick="num('-')" style="width:50;height:50;font-size:30;"><br>

<input type="button" value="7" onclick="num('7')" style="width:50;height:50;font-size:30;">
<input type="button" value="8" onclick="num('8')" style="width:50;height:50;font-size:30;">
<input type="button" value="9" onclick="num('9')" style="width:50;height:50;font-size:30;">
<input type="button" value="*" onclick="num('*')" style="width:50;height:50;font-size:30;"><br>

<input type="button" value="AC" onclick="num('ac')" style="width:50;height:50;font-size:30;">
<input type="button" value="0" onclick="num('0')" style="width:50;height:50;font-size:30;">
<input type="button" value="=" onclick="num('=')" style="width:50;height:50;font-size:30;">
<input type="button" value="/" onclick="num('/')" style="width:50;height:50;font-size:30;"><br>

</center>
<script>
function num(n)
{
  switch (n)
  {
     case "1":
	 case "2":
	 case "3":
	 case "4":
	 case "5":
	 case "6":
	 case "7":
	 case "8":
	 case "9":
	 case "0":
	 case "+":
	 case "-":
	 case "*":
	 case "/":
        document.getElementById("log").value+=n
		break
	 case "ac":
	    document.getElementById("log").value=""
		break
	 case "=":
	    var cadena=document.getElementById("log").value
	    document.getElementById("log").value=eval(cadena)
        break
  }
}  

</script>
</body>
</html>

como ven primero declaramos los input que son el cuadro de texto y los botones y mas abajo en el bloque script se encuentra la funcion num(n) la cual obtiene el elemento que fue precionado si es un numero o un operando mas, menos, multiplicacion y etcétera.

si preciona el boton AC limpia el cuadro de texto y si preciona el igual calcula la ecuacion con el comando eval

espero les guste y si hago cosas sencillas es que son para principiantes que van empesando en el mundo de la programacion, yo no me declaro maestro o profecional soy novato a un y me toca mucho que aprender saludos Flamer


No hay comentarios.:

Publicar un comentario