这是
一个简单的
打字游戏的代码，
使用JavaScript实现：
HTML：
```
html
<!DOCTYPE
html>
<
html>
<head>
<title>
打字游戏</title>
<meta charset="utf-8">
<style type="text/
css">
input {
font-size: 20px;
padding: 5px;
margin: 10px;
}
</style>
</head>
<body>
<p>在下面的输入框中输入以下内容：</p>
<p id="text">Hello World!</p>
<input type="text" id="input" onkeyup="checkInput()">
<p id="result"></p>
<script type="text/
javascript" src="game.
js"></script>
</body>
</
html>
```
JavaScript：
```
javascript
var index = 0; // 当前应输入的字符在字符串中的位置
function checkInput() {
var text = document.getElementById("text").textContent;
var input = document.getElementById("input").value;
if (input === text.slice(0, input.length)) { // 输入正确
document.getElementById("result").inner
HTML = "输入正确";
document.getElementById("result").style.color = "green";
if (input.length === text.length) { // 输入完成
document.getElementById("result").inner
HTML = "输入完成";
document.getElementById("result").style.color = "blue";
}
} else { // 输入错误
document.getElementById("result").inner
HTML = "输入错误";
document.getElementById("result").style.color = "red";
}
if (input.length > text.length) { // 输入多余字符
document.getElementById("result").inner
HTML = "输入多余字符";
document.getElementById("result").style.color = "red";
}
// 更新下
一个应输入的字符位置
if (input.length === index + 1) {
index++;
}
}
```
运行效果：
125
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
