老师，我尝试写了一下，您看哪里需要优化
来源：2-1 结构和样式
慕桂英1352525
2021-02-13 14:47:14
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<title>什么可以做返回值</title>
<style>
.counter{
height:300px;
width:1200px;
margin:0 auto;
}
.sheet{
height:30px;
width:450px;
box-shadow:0 0.5px 0 1px gray inset;
margin-top:250px;
float:left;
}
.clear{
clear:both;
}
.show{
height:35px;
width:35px;
float:left;
font-size:30px;
margin-top:250px;
text-align:center;
line-height:35px;
}
.answer{
height:35px;
width:35px;
float:left;
line-height:35px;
margin-top:250px;
font-size:30px;
}
.choosebtn{
height:50px;
width:400px;
}
.btns{
height:20px;
width:20px;
float:left;
margin-right:20px;
border:1px solid gray;
text-align:center;
line-height:20px;
}
.btns:nth-child(3){
padding-top:3px;
height:17px;
}
#btn{
height:30px;
width:200px;
margin-right:300px;
}
.anw2{
height:50px;
width:50px;
transform:translateX(500px);
}
</style>
</head>
<body>
<div class="counter">
<input class="sheet" id='sheet1' value='123'></input>
<div class="show" id='show'>+</div>
<input class="sheet" id='sheet2' value='555'></input>
<div class="show" >=</div>
<p class="answer" id='answers'></p>
<div class="clear"></div>
<div class="choosebtn">
<div class="btns">+</div>
<div class="btns">-</div>
<div class="btns">*</div>
<div class="btns">/</div>
<div class="clear"></div>
</div>
</div>
</body>
<script>
var btn=document.getElementsByClassName('btns');
function getEle(its){
var shu=document.getElementById(its).value;
if(isNaN(shu)==true||shu==''){
alert('输入的数据不是数字。');
}
else{return parseFloat(shu);}
}
function add(num1,num2){
return num1+num2;
}
function subtract(num1,num2){
return num1-num2;
}
function multiply(num1,num2){
return num1*num2;
}
function divide(num1,num2){
return num1/num2;
}
function play(i){
btn[i].onclick=function(){
var no1=getEle('sheet1'),
no2=getEle('sheet2'),
ans=document.getElementById('answers'),
shows=document.getElementById('show');
shows.innerHTML=this.innerHTML;
var funcoll=[add(no1,no2),subtract(no1,no2),multiply(no1,no2),divide(no1,no2)];
ans.innerHTML=funcoll[i]}
}
for(var i=0;i<4;i++){
play(i) ;
}
</script>
</html>
1回答
-
同学你好，这样写就很好，不用优化了，祝学习愉快！
0
相似问题