HTML猜數字游戲是一款基于前端技術開發的輕量級游戲,適合初學者練習編程邏輯和熟悉HTML語法。下面是一個簡單的HTML猜數字游戲代碼示例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML猜數字游戲</title>
</head>
<body>
<h1>HTML猜數字游戲</h1>
<p>猜測一個1到100之間的隨機數字</p>
<input id="guessInput" type="number">
<button onclick="checkGuess()">猜</button>
<p id="message"></p>
<script>
// 生成1到100的隨機數字
var randomNumber = Math.floor(Math.random() * 100) + 1;
function checkGuess() {
var guessInput = document.getElementById("guessInput");
var guess = parseInt(guessInput.value);
var message = document.getElementById("message");
// 檢查猜測的數字是不是在1到100之間
if (guess< 1 || guess >100) {
message.textContent = "請輸入一個1到100之間的數字。";
return;
}
// 判斷是否猜中
if (guess == randomNumber) {
message.textContent = "恭喜你,猜對了!";
} else if (guess< randomNumber) {
message.textContent = "猜的數字太小了,再試一次。";
} else {
message.textContent = "猜的數字太大了,再試一次。";
}
}
</script>
</body>
</html>
該代碼使用了HTML的基本元素,包括標題、段落、輸入框和按鈕。在JavaScript部分,使用Math.random()函數生成1到100之間的隨機數字,并通過document.getElementById()方法獲取輸入框和輸出信息的引用。當用戶點擊“猜”按鈕時,JavaScript代碼會對用戶輸入的數字進行判斷并顯示相應的結果。