<body>
<div class=" calculator">
<label for="inp1">num1:
<input type="text" id="inp1">
</label>
<select name="" id="sec">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
<option value="%">%</option>
</select>
<label for="inp2">num2:
<input type="text" id="inp2">
</label>
<button id='btn'>=</button>
<label for="inp3"> 结果:
<input type="text" id="inp3">
</label>
</div>
<script>
// 查找到元素
var inp1 = document.getElementById('inp1')
var inp2 = document.getElementById('inp2')
var result = document.getElementById('inp3')
// 查找按钮和select
var btn = document.getElementById('btn')
var sec = document.getElementById('sec')
// 单击按钮 添加一个点击事件
btn.onclick = function () {
switch (sec.value) {
case '+':
result.value = parseFloat(inp1.value) + parseFloat(inp2.value)
break
case '-':
result.value = inp1.value - inp2.value
break
case '*':
result.value = inp1.value * inp2.value
break
case '/':
result.value = inp1.value / inp2.value
break
case '%':
result.value = inp1.value % inp2.value
break
default:
result.value = parseFloat(inp1.value) + parseFloat(inp2.value)
break
}
}
</script>
</body>