<!DOCTYPE html>
<html>
  <head>
    <title>Tic Tac Toe - Play Online</title>
  </head>
  <style>
    #board {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      grid-template-rows: repeat(3, 1fr);
    }
<pre><code>#board &gt; div {
  border: 1px solid #000;
  text-align: center;
  font-size: 50px;
}
</code></pre>
  </style>
  <body>
    <h1>Tic Tac Toe</h1>
    <div id='board'></div>
    <script>
      const board = document.querySelector('#board');
      let turn = 'X';
<pre><code>  for (let i = 0; i &lt; 9; i++) {
    const cell = document.createElement('div');
    cell.addEventListener('click', clickCell);

    board.appendChild(cell);
  }

  function clickCell(event) {
    const cell = event.target;

    if (cell.textContent !== '') {
      return;
    }

    cell.textContent = turn;

    if (turn === 'X') {
      turn = 'O';
    } else {
      turn = 'X';
    }
  }
&lt;/script&gt;
</code></pre>
  </body>
</html>
Play Tic Tac Toe Online - Free HTML Game

原文地址: https://www.cveoy.top/t/topic/lnkP 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录