Autor: Diana Vanessa Santos Giler
Curso: 5TO Semestre
Fecha: 17/08/2021.
Práctica: 5.1
Se realizo una práctica realizando una calculadora la cual uno ingresa dos numero y los comandos de Sumar, Restar, Multiplicar y Dividir, resuelve o muestre el valor como se muestra en la imagen.
<!DOCTYPE html>
<html lang="en">
<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>Document</title>
</head>
<body>
<script>
var su;
function sumar()
{
var x1=document.getElementById("n1").value;
var x2=document.getElementById("n2").value;
x1=parseInt(x1);
x2=parseInt(x2);
su=x1+x2;
document.getElementById("resu").value=su;
}
function resta()
{
var x1=document.getElementById("n1").value;
var x2=document.getElementById("n2").value;
x1=parseInt(x1);
x2=parseInt(x2);
re=x1-x2;
document.getElementById("resu").value=re;
}
function multi()
{
var x1=document.getElementById("n1").value;
var x2=document.getElementById("n2").value;
x1=parseInt(x1);
x2=parseInt(x2);
mu=x1*x2;
document.getElementById("resu").value=mu;
}
function div()
{
var x1=document.getElementById("n1").value;
var x2=document.getElementById("n2").value;
x1=parseInt(x1);
x2=parseInt(x2);
di=x1/x2;
document.getElementById("resu").value=di;
}
</script>
<form>
<label>Ingrese número 1</label> <input type="text" id="n1"><br>
<label>Ingrese número 2</label> <input type="text" id="n2"><br>
<label>El resultado es</label> <input type="text" id="resu" readonly=
True><br>
<input type="button" value="Sumar" onclick="sumar();"><br>
<input type="button" value="Restar" onclick="resta();"><br>
<input type="button" value="*" onclick="multi();"><br>
<input type="button" value="/" onclick="div();"><br>
</form>
</body>
</html>
Práctica: 5.2
Se realizo el modelo o interfaz de una calculadora (Avance 1)
<!DOCTYPE html>
<html lang="en">
<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>Document</title>
</head>
<body>
<script>
function siete(){
document.getElementById("disp").value=document.getElementById
("disp").value+"7";
}
function ocho(){
document.getElementById("disp").value=document.getElementById
("disp") .value+"8";
}
function nueve(){
document.getElementById("disp").value=document.getElementById
("disp").value+"9";
}
function aterisco(){
document.getElementById("disp").value=document.getElementById
("disp").value+"*";
}
function divisor(){
document.getElementById("disp").value=document.getElementById
("disp").value+"/";
}
function cuatro(){
document.getElementById("disp").value=document.getElementById
("disp").value+"4";
}
function cinco(){
document.getElementById("disp").value=document.getElementById
("disp").value+"5";
}
function seis(){
document.getElementById("disp").value=document.getElementById
("disp").value+"6";
}
function mas(){
document.getElementById("disp").value=document.getElementById
("disp").value+"+";
}
function menos(){
document.getElementById("disp").value=document.getElementById
("disp").value+"-";
}
function uno(){
document.getElementById("disp").value=document.getElementById
("disp").value+"1";
}
function dos(){
document.getElementById("disp").value=document.getElementById
("disp").value+"2";
}
function tres(){
document.getElementById("disp").value=document.getElementById
("disp").value+"3";
}
function potencia(){
document.getElementById("disp").value=document.getElementById
("disp").value+"^";
}
function porcentaje(){
document.getElementById("disp").value=document.getElementById
("disp").value+"%";
}
function cero(){
document.getElementById("disp").value=document.getElementById
("disp").value+"0";
}
function punto(){
document.getElementById("disp").value=document.getElementById
("disp").value+".";
}
function ce(){
document.getElementById("disp").value=document.getElementById)
("disp").value+"C";
}
function encendido(){
document.getElementById("disp").value=document.getElementById
("disp").value+"A.C";
}
function apagado(){
document.getElementById("disp").value=document.getElementById
("disp").value+"Off";
}
</script>
<center> <table border="1">
<tr>
<td colspan="5" align="right" valign="top"><input type="text"
id="disp"></td>
</tr>
<tr>
<td> <input type="button" value="7" onClick=siete();></td>
<td> <input type="button" value="8" onClick=ocho();></td>
<td> <input type="button" value="9" onClick=nueve();></td>
<td> <input type="button" value="*" onClick=aterisco();></td>
<td> <input type="button" value="/" onClick=divisor();></td>
</tr>
<tr>
<td><input type="button" value="4" onClick=cuatro();></td>
<td> <input type="button" value="5" onClick=cinco();></td>
<td> <input type="button" value="6" onClick=seis();></td>
<td> <input type="button" value="+" onClick=mas();></td>
<td> <input type="button" value="-" onClick=menos();></td>
</tr>
<tr>
<td> <input type="button" value="1" onClick=uno();></td>
<td> <input type="button" value="2" onClick=dos();></td>
<td> <input type="button" value="3" onClick=tres();></td>
<td> <input type="button" value="^ " onClick=potencia();></td>
<td> <input type="button" value="%" onClick=porcentaje();></td>
</tr>
<tr>
<td> <input type="button" value="0" onClick=cero();></td>
<td> <input type="button" value="." onClick=punto();></td>
<td><input type="button" value="C" onClick=ce();></td>
<td> <input type="button" value="AC" onClick=encendido();></td>
<td> <input type="button" value="Off" onClick=apagado();></td>
</tr>
</center>
</table>
</body>
</html>
____________________________________________________________________
Fecha: 18/08/2021.
Práctica: 5.3
Se realizo una calculadora que funcione con sus botones y operaciones.(Avance 2)
Código:
<!DOCTYPE html>
<html lang="en">
<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>Document</title>
</head>
<body>
<script>
var op=0, aux1=0,aux2=0;
function siete(){
document.getElementById("disp").value=document.getElementById
("disp").value+"7";
}
function ocho(){
document.getElementById("disp").value=document.getElementById
("disp").value+"8";
}
function nueve(){
document.getElementById("disp").value=document.getElementById
("disp").value+"9";
}
function cuatro(){
document.getElementById("disp").value=document.getElementById
("disp").value+"4";
}
function cinco(){
document.getElementById("disp").value=document.getElementById
("disp").value+"5";
}
function seis(){
document.getElementById("disp").value=document.getElementById
("disp").value+"6";
}
function uno(){
document.getElementById("disp").value=document.getElementById
("disp").value+"1";
}
function dos(){
document.getElementById("disp").value=document.getElementById
("disp").value+"2";
}
function tres(){
document.getElementById("disp").value=document.getElementById
("disp").value+"3";
}
function cero(){
document.getElementById("disp").value=document.getElementById
("disp").value+"0";
}
function punto(){
document.getElementById("disp").value=document.getElementById
("disp").value+".";
}
function limpiar(){
document.getElementById("disp").value="";
}
function suma(){
op=1;
ope1=document.getElementById("disp").value;
document.getElementById("disp").value="";
}
function resta(){
op=2;
ope1=document.getElementById("disp").value;
document.getElementById("disp").value="";
}
function multi(){
op=3
ope1=document.getElementById("disp").value;
document.getElementById("disp").value="";
}
function divi(){
op=4;
ope1=document.getElementById("disp").value;
document.getElementById("disp").value="";
}
function igual(){
if(document.getElementById("disp").value=="")
{
ope2=ope1;
}
else{
ope2=document.getElementById("disp").value;
}
ope1=parseFloat(ope1);
ope2=parseFloat(ope2);
switch(op){
case 1:
resu=ope1+ope2;
break;
case 2:
resu=ope1-ope2;
break;
case 3:
resu=ope1*ope2
break;
case 4:
resu=ope1/op2;
default:
alert("Opción incorrecta...");
}
document.getElementById("disp").value=resu;
}
</script>
<center><table align="center" border="1" bgcolor="#FFFF00" >
<tr>
<td colspan="5" align="center" valign="top">
<input type="text" id="disp" style="text-align:right">
</td>
</tr>
<tr>
<td><input type="button" value="7" onClick="siete();"> </td>
<td><input type="button" value="8" onClick="ocho();"> </td>
<td><input type="button" value="9" onClick="nueve();"> </td>
<td><input type="button" value="*" onClick="multi();"> </td>
<td><input type="button" value="/" onClick="divi();"> </td>
</tr>
<tr>
<td><input type="button" value="4" onClick="cuatro();"> </td>
<td><input type="button" value="5" onClick="cinco();"> </td>
<td><input type="button" value="6" onClick="seis();"> </td>
<td><input type="button" value="+" onClick="suma();"> </td>
<td><input type="button" value="-" onClick="resta();"> </td>
</tr>
<tr>
<td><input type="button" value="1" onClick="uno();"> </td>
<td><input type="button" value="2" onClick="dos();"> </td>
<td><input type="button" value="3" onClick="tres();"> </td>
<td><input type="button" value="=" onClick="igual();"> </td>
<td><input type="button" value="%" onClick="porcentaje();"></td>
</tr>
<tr>
<td><input type="button" value="0" onClick="cero();"> </td>
<td><input type="button" value="." onClick="punto();"> </td>
<td><input type="button" value="C" onClick="limpiar();"> </td>
<td><input type="button" value="M1" onClick="memo();"> </td>
<td><input type="button" value="X" onClick="x();"> </td>
</tr>
</center></table>
</body>
</html>
____________________________________________________________________
No hay comentarios:
Publicar un comentario