モグラ叩き

以下が、モグラ叩きのHTMLとJavaScriptの例です。この例ではイベントリスナーを使い、クリックするたびにスコアが加算されます。

```html
<!DOCTYPE html>
<html>
  <head>
    <title>モグラ叩き</title>
    <style>
      .mole {
        width: 50px;
        height: 50px;
        background-color: #70390a;
        border-radius: 50px;
        position: absolute;
        cursor: pointer;
        display: none;
      }
    </style>
  </head>
  <body>
    <div id="game"></div>
    <script>
      // モグラの出現頻度 (ミリ秒)
      const appearanceFrequency = 1000;
      
      // スコア初期値
      let score = 0;
      
      // ゲーム画面を取得
      const game = document.getElementById("game");
      
      // ゲーム画面にクリックリスナーを追加
      game.addEventListener("click", (event) => {
        // モグラ以外の要素がクリックされた場合は何もしない
        if (!event.target.classList.contains("mole")) {
          return;
        }
        // モグラがクリックされた場合はスコアを加算して隠す
        score++;
        event.target.style.display = "none";
      });
      
      // 指定した時間後にモグラを出現させる
      function appearMole() {
        const mole = document.createElement("div");
        mole.classList.add("mole");
        mole.style.top = `${Math.random() * 80 + 10}%`;
        mole.style.left = `${Math.random() * 80 + 10}%`;
        game.appendChild(mole);
        setTimeout(() => {
          mole.style.display = "none";
          setTimeout(() => {
            game.removeChild(mole);
          }, 1000);
        }, 1000);
        setTimeout(appearMole, appearanceFrequency);
      }
      
      // モグラを出現させる
      appearMole();
    </script>
  </body>
</html>
```

ジョークとして、モグラの画像を、実際には本来のもぐらではなく、例えばモグラヘビ（モグラに似たヘビという意味）などに差し替えると面白いかもしれません。