博主信息
博文 20
粉丝 1
评论 0
访问量 21241
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
js实现极为简单的计算器
xiablog
原创
585人浏览过
超简便的计算器
  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>
批改老师:PHPzPHPz

批改状态:合格

老师批语:这种写法也能实现,只是有的代码显得比较冗余,可以优化一下
本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
作者最新博文
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学