People who dont do anything for rent's game

Click here for free DL of the app version that can save data.

No:10571

←

Prev Next

→

People who dont do anything for rent
Developer User4481｜Date and time 23/8/1 3:25:17
Build time 29.031 sec｜Game capacity 2.846KB｜

Script

了解しました。以下に、基本的なゲームの実装例を示します。

このコードは、三目並べゲームの簡単な実装例です。HTMLファイル内にJavaScriptコードを記述し、scriptタグで囲んでいます。ゲーム盤は9つのマスからなり、クリックイベントを設定しています。マスをクリックすると、現在のプレイヤーのマーク（○または×）が表示されます。勝利判定や引き分け判定も実装されています。このコードを実行すると、ブラウザで遊べるゲームが表示されます。

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームアプリランキング

Click here for free DL of the app version that can save data.

了解しました。以下に、基本的なゲームの実装例を示します。

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>ゲーム</title>
  <style>
    #game-board {
      width: 300px;
      height: 300px;
      border: 1px solid black;
      display: flex;
      flex-wrap: wrap;
    }

.cell {
      width: 33.33%;
      height: 33.33%;
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 30px;
    }
  </style>
</head>
<body>
  <div id="game-board"></div>

// ゲーム盤の作成
    for (let i = 0; i < 9; i++) {
      const cell = document.createElement("div");
      cell.classList.add("cell");
      cell.addEventListener("click", () => handleClick(i));
      gameBoard.appendChild(cell);
      cells.push(cell);
    }

let currentPlayer = "○";
    let gameEnded = false;

// ゲームの状態を表す配列
    const boardState = [
      "", "", "",
      "", "", "",
      "", "", ""
    ];

// マスをクリックしたときの処理
    function handleClick(index) {
      if (gameEnded || boardState[index] !== "") {
        return;
      }

boardState[index] = currentPlayer;
      cells[index].innerText = currentPlayer;

if (checkWinner()) {
        alert(`${currentPlayer}の勝利！`);
        gameEnded = true;
        return;
      }

if (isBoardFull()) {
        alert("引き分け！");
        gameEnded = true;
        return;
      }

currentPlayer = currentPlayer === "○" ? "×" : "○";
    }

// 勝利判定
    function checkWinner() {
      const patterns = [
        [0, 1, 2],
        [3, 4, 5],
        [6, 7, 8],
        [0, 3, 6],
        [1, 4, 7],
        [2, 5, 8],
        [0, 4, 8],
        [2, 4, 6]
      ];

for (const pattern of patterns) {
        const [a, b, c] = pattern;
        if (boardState[a] !== "" && boardState[a] === boardState[b] && boardState[b] === boardState[c]) {
          return true;
        }
      }

return false;
    }

// ボードが埋まっているかどうかの判定
    function isBoardFull() {
      return boardState.every(cell => cell !== "");
    }
  </script>
</body>
</html>
```