HTML5簡單小游戲代碼
使用HTML5可以輕松地制作簡單的小游戲。以下是一個示例代碼，展示了如何創建一個簡單的打字游戲。
<html>
<head>
<meta charset="UTF-8">
<title>打字游戲</title>
<style>
#box {
width: 500px;
height: 300px;
border: 1px solid #ccc;
margin: 0 auto;
text-align: center;
padding-top: 50px;
}
#message {
font-size: 24px;
}
#inputBox {
margin-top: 50px;
}
#inputBox input {
width: 200px;
height: 50px;
font-size: 24px;
}
</style>
</head>
<body>
<div id="box">
<div id="message"></div>
<div id="inputBox">
<input type="text" id="input" onkeyup="checkInput()">
</div>
</div>
<script>
var words = ["apple", "banana", "orange", "pear", "grape"]; // 定義單詞數組
var word = words[Math.floor(Math.random() * words.length)]; // 隨機選擇一個單詞
var message = document.getElementById("message");
var input = document.getElementById("input");
message.innerHTML = "請拼寫單詞：" + word;
function checkInput() {
var inputValue = input.value;
if (inputValue === word) {
message.innerHTML = "拼寫正確！";
word = words[Math.floor(Math.random() * words.length)];
message.innerHTML += "請拼寫單詞：" + word;
input.value = "";
}
}
</script>
</body>
</html>以上代碼創建了一個包含一個隨機單詞和輸入框的盒子。當玩家輸入的單詞與隨機單詞相同時，將提示玩家單詞拼寫正確，并更新隨機單詞。這只是一個簡單的小游戲示例，但是HTML5的靈活性使其成為創建各種小游戲的理想工具。