Community Learn Tools Library Leisure
search
English
Home > List of blog posts > js实现极为简单的计算器
Blogger Information
Blog 20
fans 1
comment 0
visits 15642
Special Recommendation
More>
Related recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
js实现极为简单的计算器
xiablog
Original
401 people have browsed it
超简便的计算器
  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>
Correcting teacher：PHPzPHPz

Correction status：qualified

Teacher's comments：这种写法也能实现，只是有的代码显得比较冗余，可以优化一下
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post