简易计算器（js）第一天
简易计算器
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>简易计算器</title>
<style>
// 设置按钮样式
button{
width: 58px;
}
</style>
<script>
//简易封装获取元素
function $(id){
return document.getElementById(id);
}
function count(flag){
var num1 = Number($('num1').value); //获取第一个数
var num2 = Number($('num2').value); //获取第二个数
var result;
switch(flag){
case'+':
result = num1+num2
break;
case'-':
result = num1-num2
break;
case'*':
result = num1*num2
break;
case'/':
result = num1/num2
break;
}
$('result').value =result; //计算结果
}
</script>
</head>
<body>
<h1>简易计算器</h1>
<P>
第一个数：<input type="text" id="num1">
</P>
<p>
第二个数：<input type="text" id="num2">
</p>
<p>
<button id="btn1" onclick="count('+')">+</button>
<button id="btn2" onclick="count('-')">-</button>
<button id="btn3" onclick="count('*')">*</button>
<button id="btn4" onclick="count('/')">/</button>
</p>
<p>
结 果：<input type="text" id="result">
</p>
</body>
</html>
