版本一:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>计算器</title><script type="text/javascript">function add(){let num1 = document.getElementById("number1").value;let num2 = document.getElementById("number2").value;if(num1 == ""){alert("数字1不能为空");return;}if (isNaN(num1)){alert("数字1输入错误");return;}if(num2 == ""){alert("数字2不能为空");return;}if (isNaN(num2)){alert("数字2输入错误");return;}let num3 = parseInt(num1) + parseInt(num2);document.getElementById("result").value = num3;}function minus(){let num1 = document.getElementById("number1").value;let num2 = document.getElementById("number2").value;if(num1 == ""){alert("数字1不能为空");return;}if (isNaN(num1)){alert("数字1输入错误");return;}if(num2 == ""){alert("数字2不能为空");return;}if (isNaN(num2)){alert("数字2输入错误");return;}let num3 = parseInt(num1) - parseInt(num2);document.getElementById("result").value = num3;}function multiplication(){let num1 = document.getElementById("number1").value;let num2 = document.getElementById("number2").value;if(num1 == ""){alert("数字1不能为空");return;}if (isNaN(num1)){alert("数字1输入错误");return;}if(num2 == ""){alert("数字2不能为空");return;}if (isNaN(num2)){alert("数字2输入错误");return;}let num3 = parseInt(num1) * parseInt(num2);document.getElementById("result").value = num3;}function divide(){let num1 = document.getElementById("number1").value;let num2 = document.getElementById("number2").value;if(num1 == ""){alert("数字1不能为空");return;}if (isNaN(num1)){alert("数字1输入错误");return;}if(num2 == ""){alert("数字2不能为空");return;}if (isNaN(num2)){alert("数字2输入错误");return;}if (num2 == 0){alert("被除数不能为0")return;}let num3 = parseInt(num1) / parseInt(num2);document.getElementById("result").value = num3;}function remainder(){let num1 = document.getElementById("number1").value;let num2 = document.getElementById("number2").value;if(num1 == ""){alert("数字1不能为空");return;}if (isNaN(num1)){alert("数字1输入错误");return;}if(num2 == ""){alert("数字2不能为空");return;}if (isNaN(num2)){alert("数字2输入错误");return;}let num3 = parseInt(num1) % parseInt(num2);document.getElementById("result").value = num3;}</script>
</head>
<body>
数字1:<input type="text" id="number1"><br>
数字2:<input type="text" id="number2"><br>
<input type="button" value="加" id="add" onclick="add()">
<input type="button" value="减" id="minus" onclick="minus()">
<input type="button" value="乘" id="multiplication" onclick="multiplication()">
<input type="button" value="除" id="divide" onclick="divide()">
<input type="button" value="取余" id="remainder" onclick="remainder()"><br>
结果:<input type="text" id = "result"></body>
</html>结果演示:
版本二:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>计算器</title><script type="text/javascript">function checkData(){let num1 = document.getElementById("number1").value;let num2 = document.getElementById("number2").value;if(num1 == ""){alert("数字1不能为空");return false;}if (isNaN(num1)){alert("数字1输入错误");return false;}if(num2 == ""){alert("数字2不能为空");return false;}if (isNaN(num2)){alert("数字2输入错误");return false;}return true;}function run(choose){if (!checkData()){return;}let num1 = parseInt(document.getElementById("number1").value);let num2 = parseInt(document.getElementById("number2").value);let num3;switch (choose){case '加':num3 = num1 + num2;break;case '减':num3 = num1 - num2;break;case '乘':num3 = num1 * num2;break;case '除':if (num2 == 0){alert("被除数不能为0")return;}num3 = num1 / num2;break;case '取余':num3 = num1 % num2;break;}document.getElementById("result").value = num3;}</script>
</head>
<body>
数字1:<input type="text" id="number1"><br>
数字2:<input type="text" id="number2"><br>
<input type="button" value="加" id="add" onclick="run('加')">
<input type="button" value="减" id="minus" onclick="run('减')">
<input type="button" value="乘" id="multiplication" onclick="run('乘')">
<input type="button" value="除" id="divide" onclick="run('除')">
<input type="button" value="取余" id="remainder" onclick="run('取余')"><br>
结果:<input type="text" id = "result">
</body>
</html>效果同上
