利用HBuilder制作简易猜数字游戏

最新推荐文章于 2026-04-28 18:12:46 发布

原创最新推荐文章于 2026-04-28 18:12:46 发布 · 4.3k 阅读

19 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#html5

收录于

这是一个使用HTML5、JavaScript编写的简单猜数字游戏。玩家需要在1-100之间输入猜测的数字，程序会根据输入提示玩家数字是大了还是小了，直到猜中为止。游戏内置了一个随机数，并记录猜测次数。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<table>
			<tr>
				猜数字游戏（请输入1-100的数字）
			</tr>
			<tr>
				<td><input id="num" type="text" />
				<button onclick="guess()">猜</button>
				<span id="result"></span>
			</tr>
		</table>

		<script type="text/javascript">
			var random = parseInt(Math.random() * 100 + 1);
			var count = 0;
			function guess() {
				count++;
				var num1 = document.getElementById('num').value;
				if (num1 < random) {
					document.getElementById('result').innerHTML = "小了";
				} else if (num1 > random) {
					document.getElementById('result').innerHTML = "大了";
				} else {
					document.getElementById('result').innerHTML = "对了，" + "猜了" + count + "次";
				}
			}
		</script>
	</body>
</html>

效果如下图：