欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页

简单计算器

程序员文章站 2022-03-06 13:11:17
...
    

  1. <!DOCTYPE html>
    2. 

  2. <html>
    3. 

  3. <head>
    4. 

  4.     <meta charset="utf-8">
    5. 

  5. <title>计算器</title>
    6. 

    7. 

    8. 

    9. 

  9. </head>
    10. 

  10. <body>
    11. 

  11. <script>
    12. 

  12.     function fn(){
    13. 

  13.         var od1= document.getElementById('d1').value
    14. 

  14.           od1=parseFloat(od1)
    15. 

  15.         var od2= document.getElementById('d2').value
    16. 

  16.           od2=parseFloat(od2)
    17. 

  17.         var od3=document.getElementById('d3')
    18. 

  18.         var oysf=document.getElementById('ysf').value
    19. 

  19.          if(oysf=='+'){
    20. 

  20.             od3.value=od1+od2
    21. 

  21.          }else if(oysf=='-'){
    22. 

  22.              od3.value=od1-od2
    23. 

  23.          }else if(oysf=='*'){
    24. 

  24.              od3.value=od1*od2
    25. 

  25.          }else {
    26. 

  26.              od3.value=od1/od2
    27. 

  27.          }
    28. 

  28.     }
    29. 

  29. </script>
    30. 

    31. 

  31. <input id="d1" type="text" value="">
    32. 

  32. <select id="ysf">
    33. 

  33.     <option value="+">+</option>
    34. 

  34.     <option value="-">-</option>
    35. 

  35.     <option value="*">*</option>
    36. 

  36.     <option value="÷">/</option>
    37. 

  37. </select>
    38. 

  38. <input id="d2" type="text" value=""><span>=</span>
    39. 

  39. <input type="text" id="d3" value="">
    40. 

  40. <button onclick="fn()">点击计算</button>
    41. 

  41. </body>
    42. 

  42. </html>
    43.

上一篇： 别再学这五个要被淘汰的编程语言了！

下一篇： ruby更换gem阿里镜像

推荐阅读