博客列表 >js实现极为简单的计算器

js实现极为简单的计算器

xiablog
xiablog原创
2021年11月19日 17:55:27400浏览
超简便的计算器
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="Generator" content="EditPlus®">
  6. <meta name="Author" content="">
  7. <meta name="Keywords" content="">
  8. <meta name="Description" content="">
  9. <title>calculator</title>
  10. </head>
  11. <body>
  12. <div>
  13. <span>第一个数</span>
  14. <input type="" name="" id="number1" value="" />
  15. <br>
  16. <span>第二个数</span>
  17. <input type="" name="" id="number2" value="" />
  18. <br>
  19. <input type="submit" value="+" onclick="add()">
  20. <input type="submit" value="-" onclick="delect()">
  21. <input type="submit" value="*" onclick="mul()">
  22. <input type="submit" value="/" onclick="divi()">
  23. <div id="">
  24. <span>计算结果:</span><span id="result"></span>
  25. </div>
  26. </div>
  27. <script type="text/javascript">
  28. //加法
  29. function add() {
  30. add1 = Number(document.getElementById("number1").value);
  31. add2 = Number(document.getElementById("number2").value);
  32. var sum;
  33. sum = add1 + add2;
  34. document.getElementById("result").innerHTML = sum;
  35. }
  36. //减法
  37. function delect() {
  38. add1 = Number(document.getElementById("number1").value);
  39. add2 = Number(document.getElementById("number2").value);
  40. var sum;
  41. sum = add1 - add2;
  42. document.getElementById("result").innerHTML = sum;
  43. }
  44. //乘法
  45. function mul() {
  46. add1 = Number(document.getElementById("number1").value);
  47. add2 = Number(document.getElementById("number2").value);
  48. var sum;
  49. sum = add1 * add2;
  50. document.getElementById("result").innerHTML = sum;
  51. }
  52. //除法
  53. function divi() {
  54. add1 = Number(document.getElementById("number1").value);
  55. add2 = Number(document.getElementById("number2").value);
  56. var sum;
  57. sum = add1 / add2;
  58. document.getElementById("result").innerHTML = sum;
  59. }
  60. </script>
  61. </body>
  62. </html>
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议