<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Калькулятор</title>
</head>
<body>
<p>Число 1:<input type="text"></p>
<p>Число 2:<input type="text"></p>
<button>Додати</button>
<button>Відняти</button>
<hr>
<p>Результат</p>
</body>
</html>
<p>Число 2:<input type="text" id="n2"></p>
var num1, num2, result;
num1 = document.getElementById('n1').value;
num1 = parseInt(num1);
num2 = document.getElementById('n2').value;
num2 = parseInt(num2);
result = num1+num2;
document.getElementById('out').innerHTML = result;
}
<html>
<head>
<title>Калькулятор</title>
</head>
<body>
<p>Число 1:<input type="text"></p>
<p>Число 2:<input type="text"></p>
<button>Додати</button>
<button>Відняти</button>
<hr>
<p>Результат</p>
</body>
</html>
Додаємо ідентифікатори для input:
<p>Число 1:<input type="text" id="n1"></p><p>Число 2:<input type="text" id="n2"></p>
а також для button
<p id="out">Результат</p>Додаємо подію для кнопки
<button onclick="plus()">Додати</button>Пишемо функцію додавання:
function plus(){var num1, num2, result;
num1 = document.getElementById('n1').value;
num1 = parseInt(num1);
num2 = document.getElementById('n2').value;
num2 = parseInt(num2);
result = num1+num2;
document.getElementById('out').innerHTML = result;
}
Немає коментарів:
Дописати коментар