1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 2 "http://www.w3.org/TR/html4/loose.dtd"> 3 <html> 4 <head> 5 <title></title> 6 7 <script> 8 9 function add(){ 10 var first=document.getElementById("first");//获取的是这个ID所对应的input节点 11 var first1=parseInt(first.value);//获得input节点的输入框的值 12 var second=document.getElementById("second"); 13 var second1=parseInt(second.value); 14 var result=document.getElementById("result"); 15 result.value=first1+second1; 16 17 } 18 function sub(){ 19 var first=document.getElementById("first"); 20 var first1=parseInt(first.value); 21 var second=document.getElementById("second"); 22 var second1=parseInt(second.value); 23 var result=document.getElementById("result"); 24 result.value=first1-second1; 25 } 26 function mul(){ 27 var first=document.getElementById("first"); 28 var first1=parseInt(first.value); 29 var second=document.getElementById("second"); 30 var second1=parseInt(second.value); 31 var result=document.getElementById("result"); 32 result.value=first1*second1; 33 } 34 function div(){ 35 var first=document.getElementById("first"); 36 var first1=parseInt(first.value); 37 var second=document.getElementById("second"); 38 var second1=parseInt(second.value); 39 var result=document.getElementById("result"); 40 result.value=first1/second1; 41 } 42 43 44 </script> 45 </head> 46 47 48 <body> 49 50 第1个数:<input type="text" name="first" id="first"><br> 51 第2个数:<input type="text" name="second" id="second"><br> 52 <input type="button" value="+" id="+" onclick="add()"> 53 <input type="button" value="-" id="-" onclick="sub()"> 54 <input type="button" value="*" id="*" onclick="mul()"> 55 <input type="button" value="/" id="/" onclick="div()"><br> 56 结果:<input type="text" name="result" id="result"> 57 </body> 58 </html>
效果展示: