生成一个js随机1到100猜数游戏
时间: 2024-10-27 10:02:58 浏览: 12
guess-game:一个非常简单的猜数游戏
当然可以,让我们创建一个简单的JavaScript猜数字游戏,玩家需要猜测从1到100之间的随机数。首先,我们需要定义一些变量、函数和一个事件监听器来控制游戏流程:
```javascript
// 创建一个随机数生成器
function getRandomNumber() {
return Math.floor(Math.random() * 100) + 1;
}
// 初始化隐藏的游戏结果
let randomNumber = getRandomNumber();
let guessInput;
// 玩家输入并验证猜数
guessInput = document.getElementById('guess-input');
guessInput.addEventListener('input', function(event) {
const inputGuess = parseInt(event.target.value);
if (!isNaN(inputGuess) && inputGuess >= 1 && inputGuess <= 100) {
// 检查猜测是否正确
if (inputGuess === randomNumber) {
alert('恭喜你,猜对了!');
} else if (inputGuess < randomNumber) {
alert('你猜的太小了,再试一次!');
} else {
alert('你猜的太大了,再试试看!');
}
} else {
alert('请输入1到100之间的整数!');
}
});
```
在这个示例中,我们首先定义了一个`getRandomNumber`函数来生成随机数。然后设置了一个输入框让用户输入猜测,并添加了一个事件监听器处理用户输入。如果输入有效,会检查它是否等于随机数,给出相应的提示。
要在HTML中包含这个输入元素和一些基本样式,你可以添加如下的代码:
```html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>猜数字</title>
</head>
<body>
<h1>猜数字游戏</h1>
<label for="guess-input">请输入你的猜测(1-100):</label>
<input type="number" id="guess-input">
<!-- 可能需要一些CSS样式以便于展示 -->
</body>
</html>
```
阅读全文