[javascript]代码库
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>计算器</title>
</head>
<style>
*{margin:0;padding:0;}ul li{list-style: none;}
.div{width:600px;height:600px;margin:100px auto;border:1px solid #c8c;}
.div>input{width:200px;height:50px;font-size: 30px;margin-bottom:10px;}
.div>ul{width:100%;height:80px;/*border:1px solid red;*/}
.div>ul>li{width:50px;height:100%;float:left;margin-left:10px;}
.div>ul>li>button{width:100%;height:100%;font-size:30px;text-align: center;}
</style>
<body>
<div class="div">
第一个数 <input type="text" id="text1"><br>
第二个数 <input type="text" id="text2"><br>
<ul>
<li><button onclick="cal('+')">+</button></li>
<li><button onclick="cal('-')">-</button></li>
<li><button onclick="cal('*')">*</button></li>
<li><button onclick="cal('/')">/</button></li>
</ul>
<br>
计算结果 <input type="text" id="textResult">
</div>
<script>
var text1=document.getElementById("text1");
var text2=document.getElementById("text2");
var textResult=document.getElementById("textResult");
function cal(str){
switch(str){
case '+':
textResult.value=parseFloat(text1.value)+parseFloat(text2.value);break;
case '-':
textResult.value=parseFloat(text1.value)-parseFloat(text2.value);break;
case '*':
textResult.value=parseFloat(text1.value)*parseFloat(text2.value);break;
case '/':
textResult.value=parseFloat(text1.value)/parseFloat(text2.value);break;
}
}
</script>
</body>
</html>
by: 发表于:2021-02-26 17:54:49 顶(0) | 踩(0) 回复
!!!
回复评论