<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>简易计算器</title>
</head>
<body>
<input type="text" id="oneNum" />
<select id="operator" />
<option value="1">+</option>
<option value="2">-</option>
<option value="3">*</option>
<option value="4">/</option>
<option value="5">%</option>
</select>
<input type="text" id="twoNum">
<span>=</span>
<span id="result"></span>
<button id="btn">计算</button>
<script>
var oneNum = document.querySelector('#oneNum');
var twoNum = document.querySelector('#twoNum');
var operator = document.querySelector('#operator');
var result = document.querySelector('#result');
var btn = document.querySelector('#btn');
btn.onclick = function () {
if (operator.value == 1) {
result.innerHTML = parseFloat(oneNum.value) + parseFloat(twoNum.value);
} else if (operator.value == 2) {
result.innerHTML = oneNum.value - twoNum.value;
}else if (operator.value == 3) {
result.innerHTML = oneNum.value * twoNum.value;
}else if (operator.value == 4) {
result.innerHTML = oneNum.value / twoNum.value;
}else if (operator.value == 5) {
result.innerHTML = oneNum.value % twoNum.value;
}
}
</script>
</body>
</html>
|