之前看到Jasin Yip写的井字棋游戏的相关代码，打算在原基础上增加一些内容。初步打算是增加界面的UI，平局判定，以及不可以在同一个空格上进行多次单击更改等功能。页面修改后的页面是下面这样的。

html.css代码如下:

目的是希望当鼠标单击各个奶酪方块时，对应的图片变成左边player1或者player2的饼干图片。但是，js代码在原基础上只更改了一点点，运行出来就不对。并且图片点击后出现下面所示的图片：

跳出的提示框上面写的是：
Javascript [objectHTMLImageElement]wins!而且对应空格上面的图片并没有更改。
js代码我只改了一点点如下，麻烦大家帮我看一下，半天没发现具体哪里错了。
var TICK = document.getElementById("o");
var CROSS = document.getElementById("x");

var model = [];
var cells = [];

var flag; // 用于表示轮到谁了

var newGame = function(){

for (i=0; i<3; i++) for (j=0; j<3; j++){ model[i][j] = 0; cells[i][j].getElementsByTagName("img").src= ' '; } flag = 1;

}

var freshView = function(){

var i, j; for (i=0; i<3; i++) for (j=0; j<3; j++) if (model[i][j] == 1) cells[i][j].getElementsByTagName("img").src= CROSS.getAttribute("src"); else if (model[i][j] == 2) cells[i][j].getElementsByTagName("img").src = TICK.getAttribute("src");

}

var checkWin = function(x, y){

// 检查 X 方向 if (model[x][y] != 0 && model[0][y] == model[1][y] && model[0][y] == model[2][y]) return 1; // 检查 Y 方向 if (model[x][y] != 0 && model[x][0] == model[x][1] && model[x][0] == model[x][2]) return 1; // 如果在 \ 方向 if (x == y) // 检查 \ 方向 if (model[0][0] != 0 && model[0][0] == model[1][1] && model[0][0] == model[2][2]) return 1; // 如果在 / 方向 if ( ( x == 2 && y == 0 ) || ( x == 0 && y == 2 ) || ( x == 1 && y == 1 ) ) // 检查 / 方向 if (model[2][0] != 0 && model[2][0] == model[1][1] && model[2][0] == model[0][2]) return 1; return 0;

}

window.onload = function(){

var i, j; // 初始化二维数组 for (i=0; i<3; i++){ model[i] = []; cells[i] = []; } for (i=0; i<3; i++) for (j=0; j<3; j++){ cells[j][i] = document.getElementById('cell-' + i + '-' + j); (function(j,i){ cells[i][j].onclick = function(){ model[i][j] = flag + 1; if (flag) flag = 0; else flag = 1; freshView(); if (checkWin(i, j)){ if (flag) alert(document.getElementById("x") + " wins!"); else alert(document.getElementById("o") + " wins!"); newGame(); } } })(i, j); } newGame();

}