首页用web页面做一个加减乘除的简易页面

用web页面做一个加减乘除的简易页面

时间: 2023-11-27 07:51:57 浏览: 76

好的，以下是一个简单的加减乘除计算器的web页面示例： ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>简易计算器</title> </head> <body> <h1>简易计算器</h1> <form> <label for="num1">第一个数：</label> <input type="number" id="num1" name="num1" required><br> <label for="operator">运算符:</label> <select id="operator" name="operator"> <option value="+">+</option> <option value="-">-</option> <option value="*">*</option> <option value="/">/</option> </select><br> <label for="num2">第二个数：</label> <input type="number" id="num2" name="num2" required><br> <input type="button" value="计算" onclick="calculate()"><br> <label for="result">结果：</label> <input type="text" id="result" name="result" readonly> </form> <script> function calculate() { var num1 = parseFloat(document.getElementById("num1").value); var num2 = parseFloat(document.getElementById("num2").value); var operator = document.getElementById("operator").value; var result; switch (operator) { case "+": result = num1 + num2; break; case "-": result = num1 - num2; break; case "*": result = num1 * num2; break; case "/": result = num1 / num2; break; } document.getElementById("result").value = result; } </script> </body> </html> ``` 这个页面包含一个表单，用户可以输入两个数和一个运算符，然后点击“计算”按钮来进行计算。计算结果将显示在一个只读的文本框中。在页面上使用了一些 HTML 元素，比如 `<form>`、`<label>`、`<input>` 和 `<select>` 等。其中，`<input>` 元素的 `type` 属性分别设置为 `number`、`button` 和 `text`。在 `<script>` 标签中定义了一个 `calculate()` 函数，用于实现加减乘除运算。

阅读全文