1<?php class=class="string">"keyword">header(class="string">'Content-Type: text/html; charset=utf-class="number">8'); ?>
2<!DOCTYPE html><class="tag">html lang="zh-CN"><class="tag">head><class="tag">meta charset="UTF-class="number">8"><class="tag">meta name="viewport" content="width=device-width,initial-scale=class="number">1.0">
3<class="tag">title>井字棋 - η空间</class="tag">title>
4<class="tag">meta name="description" content="井字棋游戏，和AI对战。免费在线玩。">
5<class="tag">link rel="stylesheet" href="/tools/share.css"><class="tag">link rel="stylesheet" href="/assets/pet-cat.css">
6<class="tag">style>
7*{margin:class="number">0;padding:class="number">0;box-sizing:border-box}
8body{font-family:class="string">'Outfit',-apple-system,sans-serif;background:class=class="string">"keyword">class=class="string">"comment">#0C0C0C;color:#F7F5F0;min-height:100vh;display:flex;flex-direction:column;align-items:center}
9h1{margin-top:30px;font-size:24px}h1 .a{color:class=class="string">"keyword">class=class="string">"comment">#FF6B35}
10.status{margin:12px class="number">0;font-size:16px;color:class=class="string">"keyword">class=class="string">"comment">#class="number">888}.status .highlight{color:#FF6B35;font-weight:class="number">600}
11.board{display:grid;grid-template-columns:repeat(class="number">3,90px);gap:4px;background:class=class="string">"keyword">class=class="string">"comment">#class="number">222;border-radius:8px;padding:4px}
12.cell{width:90px;height:90px;display:flex;align-items:center;justify-content:center;font-size:40px;font-weight:class="number">600;cursor:pointer;background:class=class="string">"keyword">class=class="string">"comment">#class="number">161616;border-radius:6px;transition:all .2s;user-select:none}
13.cell:hover{background:class=class="string">"keyword">class=class="string">"comment">#1e1e1e}
14.cell.x{color:class=class="string">"keyword">class=class="string">"comment">#60a5fa}.cell.o{color:#f472b6}
15.cell.win{background:rgba(class="number">74,class="number">222,class="number">128,class="number">0.15);box-shadow:class="number">0 class="number">0 12px rgba(class="number">74,class="number">222,class="number">128,class="number">0.2);transform:scale(class="number">1.03)}
16.controls{margin-top:16px}
17.btn{padding:8px 24px;border:none;border-radius:8px;font-size:14px;font-weight:class="number">600;cursor:pointer;background:class=class="string">"keyword">class=class="string">"comment">#FF6B35;color:#fff}
18.btn:hover{background:class=class="string">"keyword">class=class="string">"comment">#e85a2a}
19.score{margin-top:10px;display:flex;gap:20px;font-size:13px;color:class=class="string">"keyword">class=class="string">"comment">#class="number">888}
20.score .num{font-weight:class="number">700;font-size:18px}
21.score .x{color:class=class="string">"keyword">class=class="string">"comment">#60a5fa}.score .o{color:#f472b6}.score .d{color:#class="number">888}
22</class="tag">style></class="tag">head><class="tag">body>
23<class="tag">h1><class="tag">span class=class="string">"keyword">class="a">〇</class="tag">span> 井字棋</class="tag">h1>
24<class="tag">p style="font-size:12px;color:class=class="string">"keyword">class=class="string">"comment">#class="number">555;margin-bottom:8px;text-align:center">❌ 你执X（先手），AI执O。三个连成一线就赢！</class="tag">p>
25<class="tag">div class=class="string">"keyword">class="score"><class="tag">span>你(X) <class="tag">span class=class="string">"keyword">class="num x" id="scoreX">class="number">0</class="tag">span></class="tag">span><class="tag">span>平局 <class="tag">span class=class="string">"keyword">class="num d" id="scoreD">class="number">0</class="tag">span></class="tag">span><class="tag">span>AI(O) <class="tag">span class=class="string">"keyword">class="num o" id="scoreO">class="number">0</class="tag">span></class="tag">span></class="tag">div>
26<class="tag">div class=class="string">"keyword">class="status"><class="tag">span class=class="string">"keyword">class="highlight" id="status">你的回合</class="tag">span></class="tag">div>
27<class="tag">div class=class="string">"keyword">class="board" id="board"></class="tag">div>
28<class="tag">div class=class="string">"keyword">class="controls"><class="tag">button class=class="string">"keyword">class="btn" onclick="newGame()">🔄 再来一局</class="tag">button></class="tag">div>
29<class="tag">script src="/tools/share.js"></class="tag">script><class="tag">script src="/assets/pet-cat.js"></class="tag">script>
30<class="tag">script>
31class=class="string">"keyword">var board=[class="string">'',class="string">'',class="string">'',class="string">'',class="string">'',class="string">'',class="string">'',class="string">'',class="string">''],turn=class="string">'X',gameOver=false,scoreX=class="number">0,scoreO=class="number">0,scoreD=class="number">0;
32class=class="string">"keyword">function newGame(){board=[class="string">'',class="string">'',class="string">'',class="string">'',class="string">'',class="string">'',class="string">'',class="string">'',class="string">''];turn=class="string">'X';gameOver=false;
33 document.class="func">getElementById(class="string">'status').textContent=class="string">'你的回合';render();}
34class=class="string">"keyword">function render(){
35 class=class="string">"keyword">var b=document.class="func">getElementById(class="string">'board');b.innerHTML=class="string">'';
36 class=class="string">"keyword">for(class=class="string">"keyword">var i=class="number">0;i<class="number">9;i++){
37 class=class="string">"keyword">var d=document.createElement(class="string">'div');d.className=class="string">'cell';
38 class=class="string">"keyword">if(board[i]){d.textContent=board[i];d.classList.add(board[i].toLowerCase());}
39 d.class="func">addEventListener(class="string">'click',class=class="string">"keyword">function(i){class=class="string">"keyword">return class=class="string">"keyword">function(){playerMove(i)}}(i));
40 b.appendChild(d);}
41}
42class=class="string">"keyword">function playerMove(i){
43 class=class="string">"keyword">if(gameOver||board[i]||turn!==class="string">'X')class=class="string">"keyword">return;
44 board[i]=class="string">'X';render();
45 class=class="string">"keyword">if(checkWin(class="string">'X')){endGame(class="string">'你赢了! 🎉');scoreX++;updateScore();class=class="string">"keyword">return;}
46 class=class="string">"keyword">if(board.every(class=class="string">"keyword">function(c){class=class="string">"keyword">return c})){endGame(class="string">'平局!');scoreD++;updateScore();class=class="string">"keyword">return;}
47 turn=class="string">'O';document.class="func">getElementById(class="string">'status').textContent=class="string">'AI思考中...';
48 class="func">setTimeout(aiMove,class="number">400);}
49class=class="string">"keyword">function aiMove(){
50 class=class="string">"keyword">var best=-class="number">1,score=-Infinity;
51 class=class="string">"keyword">for(class=class="string">"keyword">var i=class="number">0;i<class="number">9;i++){
52 class=class="string">"keyword">if(board[i])class=class="string">"keyword">continue;
53 board[i]=class="string">'O';class=class="string">"keyword">var s=minimax(board,class="number">0,false);board[i]=class="string">'';
54 class=class="string">"keyword">if(s>score){score=s;best=i;}}
55 class=class="string">"keyword">if(best===-class="number">1){endGame(class="string">'平局!');scoreD++;updateScore();class=class="string">"keyword">return;}
56 board[best]=class="string">'O';turn=class="string">'X';document.class="func">getElementById(class="string">'status').textContent=class="string">'你的回合';render();
57 class=class="string">"keyword">if(checkWin(class="string">'O')){endGame(class="string">'AI赢了! 🤖');scoreO++;updateScore();}}
58class=class="string">"keyword">function checkWin(p){
59 class=class="string">"keyword">var wins=[[class="number">0,class="number">1,class="number">2],[class="number">3,class="number">4,class="number">5],[class="number">6,class="number">7,class="number">8],[class="number">0,class="number">3,class="number">6],[class="number">1,class="number">4,class="number">7],[class="number">2,class="number">5,class="number">8],[class="number">0,class="number">4,class="number">8],[class="number">2,class="number">4,class="number">6]];
60 class=class="string">"keyword">for(class=class="string">"keyword">var w of wins){class=class="string">"keyword">if(board[w[class="number">0]]===p&&board[w[class="number">1]]===p&&board[w[class="number">2]]===p){
61 class=class="string">"keyword">var cells=document.querySelectorAll(class="string">'.cell');
62 cells[w[class="number">0]].classList.add(class="string">'win');cells[w[class="number">1]].classList.add(class="string">'win');cells[w[class="number">2]].classList.add(class="string">'win');
63 class=class="string">"keyword">return true;}}
64 class=class="string">"keyword">return false;}
65class=class="string">"keyword">function endGame(msg){gameOver=true;document.class="func">getElementById(class="string">'status').textContent=msg;}
66class=class="string">"keyword">function updateScore(){
67 document.class="func">getElementById(class="string">'scoreX').textContent=scoreX;
68 document.class="func">getElementById(class="string">'scoreO').textContent=scoreO;
69 document.class="func">getElementById(class="string">'scoreD').textContent=scoreD;}
70class=class="string">"keyword">function minimax(board,depth,isMax){
71 class=class="string">"keyword">if(checkWin(class="string">'O'))class=class="string">"keyword">return class="number">10-depth;class=class="string">"keyword">if(checkWin(class="string">'X'))class=class="string">"keyword">return depth-class="number">10;
72 class=class="string">"keyword">if(board.every(class=class="string">"keyword">function(c){class=class="string">"keyword">return c}))class=class="string">"keyword">return class="number">0;
73 class=class="string">"keyword">if(isMax){
74 class=class="string">"keyword">var best=-Infinity;
75 class=class="string">"keyword">for(class=class="string">"keyword">var i=class="number">0;i<class="number">9;i++){class=class="string">"keyword">if(board[i])class=class="string">"keyword">continue;board[i]=class="string">'O';
76 best=Math.max(best,minimax(board,depth+class="number">1,false));board[i]=class="string">'';}
77 class=class="string">"keyword">return best;
78 }class=class="string">"keyword">else{
79 class=class="string">"keyword">var best=Infinity;
80 class=class="string">"keyword">for(class=class="string">"keyword">var i=class="number">0;i<class="number">9;i++){class=class="string">"keyword">if(board[i])class=class="string">"keyword">continue;board[i]=class="string">'X';
81 best=Math.min(best,minimax(board,depth+class="number">1,true));board[i]=class="string">'';}
82 class=class="string">"keyword">return best;}
83}
84newGame();
85</class="tag">script><class="tag">div style="text-align:center;padding-top:10px;font-size:12px;color:class=class="string">"keyword">class=class="string">"comment">#class="number">555"><class="tag">a href="source-viewer.php?file=game-tic-tac-toe.php" style="color:#FF6B35;text-decoration:none;">📖 查看源码</class="tag">a> · 编程小白，AI生成，若体验不佳请多包涵 🙏</class="tag">div>
86</class="tag">body></class="tag">html>
87