Está en la página 1de 2

<!

DOCTYPE html/>
<html>
<head>
<meta charset="utf-8">
<title>Calculadora</title>
<link rel="stylesheet" type="text/css" href="calculadora_styles.css">
</head>
<body>
<h1>Calculadora</h1>
<p>Con esta calculadora podremos hacer operaciones básicas con dos
entradas.</p>

<div class="values">
<label>Elige la operación que deseas realizar:
<select id="selector">
<option value="suma" selected>Suma</option>
<option value="resta">Resta</option>
<option value="multiplicacion">Multiplicación</option>
</select>
</label>
<br/>

<input id="valor1" type="number" value="" placeholder="Valor 1">


<span id="operador" class="operacion">+</span>
<input id="valor2" type="number" value="" placeholder="Valor 2">
</div>
<select> onchange= "cambia0peracion()">
<option value= "suma" selected>Suma</option>
<option value= "resta">Resta</option>
<option value= "multiplicacion">Multiplicación</option>
</select>

<button> onclick="calcularResultado()"
function calcularResultado (e) {
var operador = document.getElementById("valor1")("selector").value;
var valor1 = parseInt(document.getElementById("valor1").value;
var valor2 = parseInt(document.getElementById("valor2").value;
var resultado
IF (operador === 'suma') {resultado = valor1 + valor2;}
IF (operador === 'resta') {resultado = valor1 - valor2;}
IF (operador === 'multiplicacion') {resultado = valor1 * valor2;}
document.getElementById("resultado").innerHTML = resultado;
}
</button>

<div class="resultado">
<p id="resultado"></p>
</div>
</body>

<script>
function cambia0peracion(e){
var valor = document.getElementById("selector"). value;
IF (valor === 'suma') {
document.getElementById("operador").innerHTML = '+';
IF (valor === 'resta') {
document.getElementById("operador").innerHTML = '-';
IF (valor === 'multiplicacion) {
document.getElementById("operador").innerHTML = 'x';
}

También podría gustarte