请写出一个HTML代码的闯关小游戏
<h1>闯关小游戏</h1>
<p>你现在在一个迷宫里,请找到出口!</p>
<div id="room1">
<p>你现在在房间1,往哪个方向走?</p>
<button onclick="goRoom2()">往右走</button>
<button onclick="goRoom3()">往下走</button>
</div>
<div id="room2">
<p>你现在在房间2,往哪个方向走?</p>
<button onclick="goRoom1()">往左走</button>
<button onclick="goRoom4()">往右走</button>
</div>
<div id="room3">
<p>你现在在房间3,往哪个方向走?</p>
<button onclick="goRoom1()">往上走</button>
<button onclick="goRoom4()">往右走</button>
</div>
<div id="room4">
<p>你现在在房间4,往哪个方向走?</p>
<button onclick="goRoom2()">往左走</button>
<button onclick="goRoom3()">往上走</button>
<button onclick="win()">找到出口!</button>
</div>
<script>
var currentRoom = "room1";
function goRoom1() {
document.getElementById(currentRoom).style.display = "none";
document.getElementById("room1").style.display = "block";
currentRoom = "room1";
}
function goRoom2() {
document.getElementById(currentRoom).style.display = "none";
document.getElementById("room2").style.display = "block";
currentRoom = "room2";
}
function goRoom3() {
document.getElementById(currentRoom).style.display = "none";
document.getElementById("room3").style.display = "block";
currentRoom = "room3";
}
function goRoom4() {
document.getElementById(currentRoom).style.display = "none";
document.getElementById("room4").style.display = "block";
currentRoom = "room4";
}
function win() {
alert("恭喜你找到出口!");
}
</script>
原文地址: https://www.cveoy.top/t/topic/hfFe 著作权归作者所有。请勿转载和采集!