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

No:11534

100

←

Prev Next

→

Tick tack toe but the computer cheats
Developer User4910｜Date and time 23/8/10 22:20:55
Build time 36.286 sec｜Game capacity 4.248KB｜

Script

Sure! Here's a Tic Tac Toe game implemented as a single HTML file, using JavaScript. In this version, the computer cheats occasionally to make the game more challenging.

Tic Tac Toe

Restart

To play the game: 1. Copy the code above and save it as a .html file (e.g., `tic_tac_toe.html`). 2. Open the file in a web browser. 3. Play the game by tapping on the cells to make your moves. The computer will sometimes cheat to make the game more challenging. 4. When the game ends, you can restart it by clicking the "Restart" button. Enjoy playing Tic Tac Toe!

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

Sure! Here's a Tic Tac Toe game implemented as a single HTML file, using JavaScript. In this version, the computer cheats occasionally to make the game more challenging.

```html
<!DOCTYPE html>
<html>
<head>
  <title>Tic Tac Toe</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
    }
    .board {
      display: flex;
      flex-wrap: wrap;
      max-width: 300px;
      margin: 20px auto;
    }
    .cell {
      width: 100px;
      height: 100px;
      border: 1px solid #000;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 48px;
      cursor: pointer;
    }
    .cell:hover {
      background-color: #f0f0f0;
    }
    #message {
      margin-top: 20px;
      font-weight: bold;
      font-size: 20px;
    }
    .restart {
      margin-top: 20px;
      cursor: pointer;
      color: blue;
    }
  </style>
</head>
<body>
  <h1>Tic Tac Toe</h1>
  <div class="board"></div>
  <div id="message"></div>
  <div class="restart">Restart</div>

// DOM elements
    const cells = document.querySelectorAll('.cell');
    const restartBtn = document.querySelector('.restart');
    const message = document.querySelector('#message');

// Initialize the game
    startGame();

function startGame() {
      board = ['','','','','','','','',''];
      currentPlayer = 'X';
      gameOver = false;
      message.textContent = '';

cells.forEach(cell => {
        cell.textContent = '';
        cell.addEventListener('click', handleClick);
      });

restartBtn.style.display = 'none';
    }

function handleClick(e) {
      const cellIndex = parseInt(e.target.dataset.index);
      if (board[cellIndex] === '' && !gameOver) {
        board[cellIndex] = currentPlayer;
        e.target.textContent = currentPlayer;

if (checkForWin(currentPlayer)) {
          endGame(currentPlayer + ' wins!');
        } else if (checkForDraw()) {
          endGame("It's a draw!");
        } else {
          currentPlayer = (currentPlayer === 'X') ? 'O' : 'X';
          if (currentPlayer === 'O') {
            computerMove();
          }
        }
      }
    }

function computerMove() {
      let availableMoves = board.reduce((acc, cell, index) => {
        return (cell === '') ? acc.concat(index) : acc;
      }, []);

// Add a delay to make it seem like the computer is "thinking"
      setTimeout(() => {
        const randomIndex = Math.floor(Math.random() * availableMoves.length);
        const moveIndex = availableMoves[randomIndex];

board[moveIndex] = currentPlayer;
        cells[moveIndex].textContent = currentPlayer;

function checkForWin(player) {
      return winningCombinations.some(combination => {
        return combination.every(index => {
          return board[index] === player;
        });
      });
    }

function checkForDraw() {
      return board.every(cell => {
        return cell !== '';
      });
    }

function endGame(messageText) {
      gameOver = true;
      message.textContent = messageText;
      restartBtn.style.display = 'block';
      cells.forEach(cell => {
        cell.removeEventListener('click', handleClick);
      });
    }

restartBtn.addEventListener('click', startGame);
  </script>
</body>
</html>
```

To play the game:

1. Copy the code above and save it as a .html file (e.g., `tic_tac_toe.html`).
2. Open the file in a web browser.
3. Play the game by tapping on the cells to make your moves. The computer will sometimes cheat to make the game more challenging.
4. When the game ends, you can restart it by clicking the "Restart" button.

Enjoy playing Tic Tac Toe!