javascript的简单加减乘除

た入场券 2022-06-09 10:54 177阅读 0赞

<table> 
 <tbody> 
 <tr> 
 <td>&lt;head&gt;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&lt;meta charset="UTF-8"&gt;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&lt;title&gt;加减乘除&lt;/title&gt;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&lt;/head&gt;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&lt;body&gt;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&nbsp;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&lt;label for="num1"&gt;第一个数：&lt;/label&gt;&lt;input type="text" id="num1"&gt;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&lt;label for="num2"&gt;第二个数：&lt;/label&gt; &lt;input type="text" id="num2"&gt;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&lt;label for="result"&gt;结果：&lt;/label&gt;&lt;input type="text" id="result"&gt;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&lt;button id="add" onclick="add()"&gt;加&lt;/button&gt;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&lt;button id="less" onclick="less()"&gt;减&lt;/button&gt;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&lt;button id="mult" onclick="mult()"&gt;乘&lt;/button&gt;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&lt;button id="del" onclick="del()"&gt;除&lt;/button&gt;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&nbsp;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&nbsp;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&lt;script&gt;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&nbsp;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>function add(){ </td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>var a=document.getElementById('num1').value*1;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>var b=document.getElementById('num2').value*1;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>var r=0;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>r=a+b;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>document.getElementById('result').value= r;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>}</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&nbsp;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>function less(){ </td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>var a=document.getElementById('num1').value*1;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>var b=document.getElementById('num2').value*1;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>var r=0;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>r= a - b;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>document.getElementById('result').value= r;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>}</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>function mult(){ </td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>var a=document.getElementById('num1').value*1;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>var b=document.getElementById('num2').value*1;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>var r=0;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>r= a * b;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>document.getElementById('result').value= r;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>}</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>function del(){ </td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>var a=document.getElementById('num1').value*1;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>var b=document.getElementById('num2').value*1;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>var r=0;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>r= a/ b;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>document.getElementById('result').value= r;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>}</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>// document.getElementById('result').value= r;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&lt;/script&gt;</td> 
 </tr> 
 <tr> 
 <td>&nbsp;</td> 
 <td>&lt;/body&gt;</td> 
 </tr> 
 </tbody> 
</table>

注意：

<table> 
 <tbody> 
 <tr> 
 <td>var a=document.getElementById('num1').value*1;</td> 
 </tr> 
 </tbody> 
</table>

是为了将输入的转化成number型，这样可以进行数字运算，要不然就是字符串的运算拼接

<table> 
 <tbody> 
 <tr> 
 <td>var a=document.getElementById('num1').value*1;</td> 
 </tr> 
 </tbody> 
</table>