[javascript] 编写一个计算器,实现加减法

时间:2019-10-20
本文章向大家介绍[javascript] 编写一个计算器,实现加减法,主要包括[javascript] 编写一个计算器,实现加减法使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

1、代码

 1 <script>
 2 function sum(){     //加法
 3   var value1 = document.getElementById("num1").value;
 4   var value2= document.getElementById("num2").value;
 5   var result = parseInt(value1)+parseInt(value2);//转换为数字,再进行加法
 6   document.getElementById("result1").value=result;     //  把result作为result1这个方框ID的输出
 7 }
 8 </script>
 9 
10 <script>
11 function sub(){     //加法
12   var value3 = document.getElementById("num3").value;
13   var value4= document.getElementById("num4").value;
14   var result = parseInt(value3)-parseInt(value4);     //转换为数字,再进行减法
15   document.getElementById("result2").value=result;   //把result作为result2这个方框ID的输出
16 }
17 </script>
18 
19 <table >
20    <tr>
21       <td width="100px" ><input type="number" id="num1" value="1" color="red">  </td>
22       <td width="40px">+</td>
23       <td width="100px" ><input type="number" id="num2" value="2">  </td>
24       <td width="70px">=</td>
25        <td width="100px" > <input type="number" id="result1" value=""></td>
26       <td width="70px"><input type="button" value="加法" onclick="sum()" ></td>
27    </tr>
28    
29    <tr>
30       <td width="100px" ><input type="number" id="num3" value="1">  </td>
31       <td width="40px">-</td>
32       <td width="100px" ><input type="number" id="num4" value="2">  </td>
33       <td width="70px">=</td>
34        <td width="100px" > <input type="number" id="result2" value=""></td>
35       <td width="70px"><input type="button" value="减法" onclick="sub()" ></td>
36    </tr>
37 </table>

2、效果

原文地址:https://www.cnblogs.com/zf007/p/11707469.html