初学者的JS计算器-CSDN博客

本文链接：https://blog.csdn.net/weixin_42036303/article/details/105292533

最近初学js,写了一个小计算器玩玩，分享给大家。`
在这里插入图片描述界面真的很丑啊🤫

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>计算器</title>
<script type="text/javascript" >
	function deliver(value){
		
	document.getElementById('display').value+=value;
	}
	function cclt(){
		var result=0;
		result=document.getElementById('display').value;
		document.getElementById('display').value=eval(result);
	}
	
	function oclear(){
		document.getElementById('display').value='';
	}
	</script>		
</head>

<body>
	
	
	<center>
		
	<div style="background-color: aquamarine; height: 600px; width: 300px;">
		<br>
		<br>
<input type="text"  id="display" style="width: 290px; text-align: right;" value="" >
	<br>
	<br>
<input type="button" value="1"  onclick="deliver(value)" style="width:50px;"  >	
<input type="button" value="2"  onclick="deliver(value)" style="width:50px;"> 
<input type="button" value="3"  onclick="deliver(value)" style="width:50px;">
	<br>
		
<input type="button" value="4"  onclick="deliver(value)" style="width:50px;">	
<input type="button" value="5"  onclick="deliver(value)" style="width:50px;">	
<input type="button" value="6"  onclick="deliver(value)" style="width:50px;">	
	<br>
<input type="button" value="7" onclick="deliver(value)" style="width:50px;">	
<input type="button" value="8" onclick="deliver(value)" style="width:50px;">	
<input type="button" value="9" onclick="deliver(value)" style="width:50px; height: auto">
	<br>
<input type="button" value="0" onclick="deliver(value)" style="width: 160px;">
	<br>
		
<input type="button" value="+"   onclick="deliver(value)" style="width: 40px;   margin-right:-5px;">	
<input type="button" value="-"  onclick="deliver(value)" style="width: 40px;	margin-right:-2px;">	
<input type="button" value="*"  onclick="deliver(value)" style="width: 40px;	margin-left:-2px;">	
<input type="button" value="/"   onclick="deliver(value)" style="width: 40px;	margin-left:-4.5px;">
		<br>
<input type="button" value="="  style="width: 160px;" onclick="cclt()">
<input type="button" value="clear"  style="width: 160px;" onclick="oclear()">
		</div>
</center></body>
</html>