使用JavaScript设计一个猜数游戏页面,点击“开始”按钮开始猜数游戏,输入一个1~100之间任一整数,如果输入数字正确,弹出 “恭喜输入数字正确” 提示信息;否则提示“输入数字不正确,请重新输入”。
时间: 2024-04-29 09:26:04 浏览: 104
好的,我了解你的要求。您可以按照以下步骤实现猜数游戏页面:
1. 在HTML文件中定义一个输入框和一个开始按钮。
```html
<input type="text" id="guess-input" placeholder="请输入一个1~100之间的整数"/>
<button onclick="guess()">开始</button>
```
2. 在JavaScript文件中编写guess()函数,实现猜数游戏逻辑。
```javascript
function guess() {
var input = document.getElementById("guess-input").value;
var answer = Math.floor(Math.random() * 100) + 1; // 生成1~100之间的随机数字
if (input == answer) {
alert("恭喜输入数字正确!");
} else {
alert("输入数字不正确,请重新输入。");
}
}
```
3. 在CSS文件中美化页面样式。
```css
input[type="text"] {
margin-right: 10px;
padding: 5px;
border: 1px solid #ccc;
border-radius: 3px;
font-size: 16px;
outline: none;
}
button {
padding: 5px 10px;
background-color: #007bff;
color: #fff;
border-radius: 3px;
cursor: pointer;
outline: none;
border: none;
}
button:hover {
background-color: #0069d9;
}
```
这样,您就可以实现一个简单的猜数游戏页面了。希望能对您有帮助!
阅读全文