练习-实现两个数的四则运算 需求描述 单击页面中“计算两数运算结果”按钮时,调用函数,使用 prompt0方法获取两个变量和一个运算符,效果如图 2.5~图28 所示。获取变量和运算符后将计算结果输出在页面中,效果如图 2.8 所示
时间: 2023-11-27 12:54:25 浏览: 59
简单布尔运算
这里提供一个简单的实现,可以通过 HTML 和 JavaScript 实现:
HTML 代码:
```html
<!DOCTYPE html>
<html>
<head>
<title>两数四则运算</title>
</head>
<body>
<h1>两数四则运算</h1>
<label for="num1">第一个数:</label>
<input type="number" id="num1"><br><br>
<label for="operator">运算符:</label>
<input type="text" id="operator"><br><br>
<label for="num2">第二个数:</label>
<input type="number" id="num2"><br><br>
<button onclick="calculate()">计算两数运算结果</button><br><br>
<label for="result">结果:</label>
<input type="number" id="result" disabled>
</body>
</html>
```
JavaScript 代码:
```javascript
function calculate() {
var num1 = parseInt(document.getElementById("num1").value);
var operator = document.getElementById("operator").value;
var num2 = parseInt(document.getElementById("num2").value);
var result = 0;
switch(operator) {
case "+":
result = num1 + num2;
break;
case "-":
result = num1 - num2;
break;
case "*":
result = num1 * num2;
break;
case "/":
result = num1 / num2;
break;
default:
alert("请输入正确的运算符!");
return;
}
document.getElementById("result").value = result;
}
```
上面的代码通过获取用户输入的两个数和运算符,然后使用 switch 语句进行计算,并将结果输出到页面中。需要注意的是,输入的数需要使用 parseInt 转换为整数,以免出现计算错误。同时,对于运算符输入错误的情况,需要进行提示。
阅读全文