html实现简单的计算功能与实时更新时间

简单的计算器
实时更新时间

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>在线计算器</title>
		<style>
			table {
				margin: auto;
				text-align: center;
				background-color: darkgray;
			}
			div {
				width: 500px;
				height: 500px;
				border: 10 solid black;
				margin: auto;
			}
		</style>
		<script>
			function result(op) {
				var num1, num2;
				num1 = Number(document.getElementById("num1").value);
				num2 = Number(document.getElementById("num2").value);
				switch(op) {
					case '+':
						document.getElementById("result").value = num1 + num2;
						break;
					case '-':
						document.getElementById("result").value = num1 - num2;
						break;
					case '*':
						document.getElementById("result").value = num1 * num2;
						break;
					case '/':
						document.getElementById("result").value = num1 / num2;
						break;
				}
			}
		</script>

	</head>

	<body>
		<div>
			<p align="center" style="margin-top: 100px;">
				当地时间:<input type="text" id="1" size="22" />
				<script>
					function a() {
						var data = new Date();
						var time = data.toLocaleString();
						document.getElementById("1").value = time;
					}
					setInterval("a()", 1)
				</script>
			</p>
			<table>
				<tr>
					<td colspan="4">简单计算器<br/>
						<hr/>
					</td>
				</tr>
				<tr>
					<td colspan="4">第一个数<input type="text" id="num1" /></td>
				</tr>
				<tr>
					<td colspan="4">第二个数<input type="text" id="num2" /><br/>
						<hr/>
					</td>
				</tr>
				<tr>
					<td>
						<input type="button" value="+" onclick="result('+')" />
					</td>
					<td>
						<input type="button" value="-" onclick="result('-')" />
					</td>
					<td>
						<input type="button" value="*" onclick="result('*')" />
					</td>
					<td>
						<input type="button" value="/" onclick="result('/')" />
					</td>
				</tr>
				<tr>
					<td colspan="4">
						<hr/>
					</td>
				</tr>
				<tr>
					<td colspan="4">计算结果<input type="text" id="result" /></td>
				</tr>
			</table>
		</div>
	</body>

</html>

猜你喜欢

转载自blog.csdn.net/qq_42036640/article/details/83350634