猜数游戏的html 和JavaScript函数代码
时间: 2024-05-09 22:15:19 浏览: 9
以下是一个简单的猜数游戏的 HTML 和 JavaScript 函数代码。用户需要在输入框中猜出一个 1 到 100 之间的随机数。每次猜测后,程序会提示用户猜测的数是高了还是低了,并记录猜测次数。如果用户猜中了,程序会弹出一个提示框,并显示猜测次数。
HTML 代码:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Guessing Game</title>
<script src="guess.js"></script>
</head>
<body>
<h1>Guessing Game</h1>
<p>Guess a number between 1 and 100:</p>
<input type="text" id="guess">
<button onclick="play()">Guess</button>
<p id="output"></p>
</body>
</html>
```
JavaScript 代码:
```javascript
var target = Math.floor(Math.random() * 100) + 1;
var count = 0;
function play() {
var guess = parseInt(document.getElementById("guess").value);
count++;
if (guess == target) {
alert("Congratulations! You guessed the number in " + count + " tries!");
} else if (guess < target) {
document.getElementById("output").innerHTML = "Your guess is too low.";
} else {
document.getElementById("output").innerHTML = "Your guess is too high.";
}
}
```
这个程序通过 `Math.random()` 函数生成一个 1 到 100 之间的随机整数作为目标数。在用户点击“Guess”按钮后,程序会获取用户输入的数,并和目标数进行比较。如果猜中了,弹出提示框并显示猜测次数;如果猜测的数比目标数小,则在页面上显示“Your guess is too low.”;如果猜测的数比目标数大,则在页面上显示“Your guess is too high.”。每次猜测后,程序会将猜测次数加 1。