HTML CSS JS学习笔记之实现网页计算器1，阿里巴巴二面被血虐
以下是一个简单的网页计算器实现的代码示例，仅包含HTML和JavaScript，没有使用CSS。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Calculator</title>
<script>
function calculate() {
var firstNumber = parseFloat(document.getElementById('firstNumber').value);
var secondNumber = parseFloat(document.getElementById('secondNumber').value);
var operator = document.getElementById('operators').value;
var result;
switch (operator) {
case '+':
result = firstNumber + secondNumber;
break;
case '-':
result = firstNumber - secondNumber;
break;
case '*':
result = firstNumber * secondNumber;
break;
case '/':
if (secondNumber === 0) {
result = 'Cannot divide by zero';
} else {
result = firstNumber / secondNumber;
}
break;
default:
result = 'Invalid operator';
break;
}
document.getElementById('result').value = result;
}
</script>
</head>
<body>
<input type="text" id="firstNumber" placeholder="First Number">
<select id="operators">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type="text" id="secondNumber" placeholder="Second Number">
<button onclick="calculate()">Calculate</button>
<input type="text" id="result" placeholder="Result" readonly>
</body>
</html>这段代码实现了一个简单的计算器功能，用户可以输入两个数字和一个运算符，点击“Calculate”按钮后，会显示计算结果。需要注意的是，这个实现没有包括错误处理，比如输入非数字或除数为零的情况。
评论已关闭