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

No:37253

←

Prev Next

→

Tic toe game
Developer User17046｜Date and time 24/1/20 22:54:56
Build time 12.699 sec｜Game capacity 2.831KB｜

Script

Sure, here's a simple implementation of a Tic-Tac-Toe game as a single HTML file:

Tic-Tac-Toe

This HTML file includes the necessary script tags and contains JavaScript code within those tags. The game is playable on a smartphone as it uses clickable div elements as the game board cells. The game logic checks for a winner after each move and alerts the result accordingly. The game can be reset by calling the `resetGame()` function.

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

Sure, here's a simple implementation of a Tic-Tac-Toe game as a single HTML file:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Tic-Tac-Toe</title>
  <style>
    .cell {
      width: 100px;
      height: 100px;
      border: 1px solid black;
      text-align: center;
      font-size: 48px;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <h1>Tic-Tac-Toe</h1>
  <div id="gameboard">
    <div class="cell" onclick="makeMove(0, 0)"></div>
    <div class="cell" onclick="makeMove(0, 1)"></div>
    <div class="cell" onclick="makeMove(0, 2)"></div>
    <div class="cell" onclick="makeMove(1, 0)"></div>
    <div class="cell" onclick="makeMove(1, 1)"></div>
    <div class="cell" onclick="makeMove(1, 2)"></div>
    <div class="cell" onclick="makeMove(2, 0)"></div>
    <div class="cell" onclick="makeMove(2, 1)"></div>
    <div class="cell" onclick="makeMove(2, 2)"></div>
  </div>

for (let i = 0; i < winningCombinations.length; i++) {
        const [a, b, c] = winningCombinations[i];
        if (
          cells[a].innerHTML === cells[b].innerHTML &&
          cells[b].innerHTML === cells[c].innerHTML &&
          cells[a].innerHTML !== ''
        ) {
          return cells[a].innerHTML;
        }
      }

return null;
    }

// Function to make a move
    function makeMove(row, col) {
      const cell = document.querySelector(`#gameboard > div:nth-child(${row * 3 + col + 1})`);
      if (cell.innerHTML === '') {
        cell.innerHTML = currentPlayer;
        currentPlayer = currentPlayer === 'X' ? 'O' : 'X';
        const winner = checkWinner();
        if (winner) {
          alert(`${winner} wins!`);
          resetGame();
        } else if ([...document.querySelectorAll('.cell')].every(cell => cell.innerHTML !== '')) {
          alert("It's a draw!");
          resetGame();
        }
      }
    }

// Function to reset the game
    function resetGame() {
      const cells = document.querySelectorAll('.cell');
      for (let i = 0; i < cells.length; i++) {
        cells[i].innerHTML = '';
      }
      currentPlayer = 'X';
    }

let currentPlayer = 'X';
  </script>
</body>
</html>
```