もぐらたたきゲーム
Score: 0
Game Over!
以下は、もぐらを叩くゲームの実装例です。セキュリティ上の問題を避けるため、evalや他のサイトへの遷移、リダイレクトは行いません。 ```html <!DOCTYPE html> <html> <head> <title>もぐらたたきゲーム</title> <style> .hole { width: 100px; height: 100px; background-color: #333; border-radius: 50%; position: relative; cursor: pointer; } .mole { width: 80px; height: 80px; background-color: #c96; border-radius: 50%; position: absolute; top: 10px; left: 10px; display: none; } .score { font-size: 24px; font-weight: bold; } .game-over-text { font-size: 36px; font-weight: bold; color: red; display: none; text-align: center; margin-top: 100px; } </style> </head> <body> <h1>もぐらたたきゲーム</h1> <div class="score">Score: <span id="score">0</span></div> <div class="hole" onclick="hitMole()"><div class="mole"></div></div> <div class="game-over-text" id="gameOverText">Game Over!</div> <script> var score = 0; var gameOver = false; var timer = null; // モグラたたく関数 function hitMole() { if (!gameOver) { score++; document.getElementById("score").innerHTML = score; var mole = document.querySelector(".mole"); mole.style.display = "none"; var holes = document.querySelectorAll(".hole"); var randomHole = holes[Math.floor(Math.random() * holes.length)]; randomHole.querySelector(".mole").style.display = "block"; } } // ゲーム終了関数 function endGame() { gameOver = true; clearInterval(timer); document.getElementById("gameOverText").style.display = "block"; } // スタート関数 function startGame() { score = 0; gameOver = false; document.getElementById("score").innerHTML = score; document.getElementById("gameOverText").style.display = "none"; var holes = document.querySelectorAll(".hole"); for (var i = 0; i < holes.length; i++) { holes[i].querySelector(".mole").style.display = "none"; } // モグラが出現するタイマー timer = setInterval(function() { var holes = document.querySelectorAll(".hole"); var randomHole = holes[Math.floor(Math.random() * holes.length)]; var mole = randomHole.querySelector(".mole"); if (mole.style.display !== "block") { mole.style.display = "block"; setTimeout(function() { mole.style.display = "none"; if (!gameOver && score < 10) { var newRandomHole = randomHole; while (newRandomHole === randomHole) { newRandomHole = holes[Math.floor(Math.random() * holes.length)]; } newRandomHole.querySelector(".mole").style.display = "block"; } }, 1000); } else { randomHole.querySelector(".mole").style.display = "none"; if (!gameOver && score < 10) { randomHole = holes[Math.floor(Math.random() * holes.length)]; randomHole.querySelector(".mole").style.display = "block"; } } if (score >= 10) { endGame(); } }, 1000); } // ゲームスタート startGame(); </script> </body> </html> ``` ジョークは、このゲームには適用されていませんが、ほかのアプリで利用できるかもしれません。