今天我來(lái)介紹一款基于HTML編寫的猜數(shù)字小游戲，源代碼如下：
<!DOCTYPE html>
<html>
<head>
<title>猜數(shù)字游戲</title>
<meta charset="UTF-8">
</head>
<body>
<h1>猜數(shù)字游戲</h1>
<p>請(qǐng)猜一個(gè)1~100之間的整數(shù):</p>
<input type="text" id="guess">
<br>
<button onclick="checkGuess()">提交</button>
<p id="hint"></p>
<script>
var answer = Math.floor(Math.random() * 100) + 1; //生成隨機(jī)數(shù)
var guessTime = 0; //猜測(cè)次數(shù)初始化為0
function checkGuess() {
var guess = document.getElementById("guess").value.trim(); //獲取輸入的值并去除首尾空格
var hint = document.getElementById("hint");
if (isNaN(guess) || guess == "") {
hint.innerHTML = "請(qǐng)輸入一個(gè)有效數(shù)字！";
return; //輸入無(wú)效，終止函數(shù)
}
guessTime++; //計(jì)算猜測(cè)次數(shù)
if (guess< answer) {
hint.innerHTML = `第${guessTime}次猜測(cè)：${guess}，猜小了！`;
return;
}
if (guess >answer) {
hint.innerHTML = `第${guessTime}次猜測(cè)：${guess}，猜大了！`;
return;
}
//猜對(duì)了
hint.innerHTML = `恭喜你，第${guessTime}次猜測(cè)：${guess}，猜對(duì)了！`;
//禁用輸入框和按鈕
document.getElementById("guess").disabled = true;
document.getElementsByTagName("button")[0].disabled = true;
}
</script>
</body>
</html>在這個(gè)小游戲中，用戶需要輸入一個(gè)整數(shù)來(lái)猜測(cè)預(yù)設(shè)的隨機(jī)數(shù)字，并在每次猜測(cè)后實(shí)時(shí)給出提示，直到猜對(duì)為止。同時(shí)，還會(huì)記錄猜測(cè)次數(shù)。當(dāng)猜中時(shí)，會(huì)顯示恭喜信息，并禁用輸入框和按鈕。
希望大家可以通過(guò)這個(gè)小例子，更好地了解HTML編程的應(yīng)用和基本語(yǔ)法。