<html>
<head>
  <title>Tic-Tac-Toe</title>
  <style>
    table {
      border-collapse: collapse;
    }
    td {
      width: 50px;
      height: 50px;
      text-align: center;
      font-size: 30px;
    }
    td:hover {
      background-color: #ccc;
    }
  </style>
</head>
<body>
  <h1>Tic-Tac-Toe</h1>
  <table>
    <tr>
      <td id='1'></td>
      <td id='2'></td>
      <td id='3'></td>
    </tr>
    <tr>
      <td id='4'></td>
      <td id='5'></td>
      <td id='6'></td>
    </tr>
    <tr>
      <td id='7'></td>
      <td id='8'></td>
      <td id='9'></td>
    </tr>
  </table>
  <script>
    let turn = 'X';
    let boxes = document.querySelectorAll('td');
    for (let i = 0; i < boxes.length; i++) {
      boxes[i].addEventListener('click', function() {
        if (this.innerHTML == '') {
          this.innerHTML = turn;
          if (turn == 'X') {
            turn = 'O';
          } else {
            turn = 'X';
          }
        }
      });
    }
  </script>
</body>
</html>
Play Tic Tac Toe Online - No Instructions Needed!

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

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