用js实现简单计算器
一、所用方法
1、如何获取元素
var input1= document.getElementById('one');
2、如何获取表单元素的值
sum=Number(input1.value)+Number(input2.value);
3.如何绑定点击事件
input4.onclick=function(){}
二、计算器代码
下面展示一些内联代码片
。
<!DOCTYPE html>
<html>
<head>
<title>计算器</title>
<meta charset="utf-8">
</head>
<body>
<input type="text" id="one" name="">
<select id="three">
<option>+</option>
<option>-</option>
<option>*</option>
<option>/</option>
</select>
<input type="text" id="two" name="">
<button id="four">提交</button>
<input type="text" id="result" name="">
</body>
</html>
<script type="text/javascript">var input1= document.getElementById('one');var input2= document.getElementById('two');var input3= document.getElementById('three');var input4= document.getElementById('four');
input4.onclick=function(){if(input3.value==='+'){
sum=Number(input1.value)+Number(input2.value);
document.getElementById("result").value= sum;}elseif(input3.value==='-'){
jian=Number(input1.value)-Number(input2.value);
document.getElementById("result").value= jian;}elseif(input3.value==='*'){
cheng=Number(input1.value)*Number(input2.value);
document.getElementById("result").value= cheng;}elseif(input3.value==='/'){
cheng=Number(input1.value)/Number(input2.value);
document.getElementById("result").value= cheng;}}</script>