在这个示例中,我们将展示如何使用 JavaScript 创建一个简单的计算器。以下是一个简单的 HTML 和 JavaScript 代码示例,用于实现基本的加法、减法、乘法和除法功能。
代码示例
<!DOCTYPE html>
<html>
<head>
<title>JavaScript 计算器</title>
</head>
<body>
<h1>JavaScript 计算器</h1>
<input type="text" id="display" disabled>
<br>
<button onclick="add()">+</button>
<button onclick="subtract()">-</button>
<button onclick="multiply()">*</button>
<button onclick="divide()">/</button>
<button onclick="clearDisplay()">C</button>
<br>
<input type="number" id="number1">
<input type="number" id="number2">
<br>
<button onclick="calculate()">=</button>
<script>
let currentOperation = null;
let number1 = 0;
let number2 = 0;
let displayValue = 0;
function add() {
currentOperation = 'add';
number1 = parseFloat(document.getElementById('number1').value);
displayValue = number1;
}
function subtract() {
currentOperation = 'subtract';
number1 = parseFloat(document.getElementById('number1').value);
displayValue = number1;
}
function multiply() {
currentOperation = 'multiply';
number1 = parseFloat(document.getElementById('number1').value);
displayValue = number1;
}
function divide() {
currentOperation = 'divide';
number1 = parseFloat(document.getElementById('number1').value);
displayValue = number1;
}
function clearDisplay() {
displayValue = 0;
document.getElementById('display').value = '';
}
function calculate() {
number2 = parseFloat(document.getElementById('number2').value);
if (currentOperation === 'add') {
displayValue = number1 + number2;
} else if (currentOperation === 'subtract') {
displayValue = number1 - number2;
} else if (currentOperation === 'multiply') {
displayValue = number1 * number2;
} else if (currentOperation === 'divide') {
if (number2 !== 0) {
displayValue = number1 / number2;
} else {
alert('除数不能为0');
return;
}
}
document.getElementById('display').value = displayValue;
}
</script>
</body>
</html>
扩展阅读
如果你对 JavaScript 学习感兴趣,可以访问我们网站的 JavaScript 教程 页面,了解更多关于 JavaScript 的知识。