<脚本>
// **************************************************** ******************************************
//井字游戏,由iam_clint(
www.thescripts.com ),您可以在任何希望的网站上使用它。// **************************************************** ** *****************************************
//全局变量声明
var turn = 0;
var comp = 0;
var computer;
var active = false;
window.onload = resetGame; //在加载窗口时开始游戏。
函数setXO(row,col){
//此函数将X或O设置在适当的位置
如果(有效){
var tbl = document.getElementById(“ ttt”);
var cRow = tbl.getElementsByTagName(“ tr”)[行];
var cCol = cRow.getElementsByTagName(“ td”)[col];
if(cCol.getAttribute(“ xo”)==“ 0”){//确保您单击的位置尚未标记
如果(turn == 2 && document.getElementById(“ computer”)。checked && comp == 0){alert(“不是你的回合!”); 返回false; } //检查以确保轮到您了。
cCol.setAttribute(“ xo”,turn); //将玩家编号设置到该位置
document.getElementById(“ write”)。play(); //播放音频文件,因为您单击并可以使用该位置;
if(turn == 1){turn = 2; cCol.innerHTML =“ <img src ='x.gif'>”; } else {turn = 1; cCol.innerHTML =“ <img src ='o.gif'>”; comp = 0; } //将玩家形象设置在适当的位置。
updateTurn(); //更新是谁
}
}
}
函数updateTurn(){
//更新轮到谁了。
如果(有效){
checkWinner();
checkDraw();
document.getElementById(“ turn”)。innerHTML =“玩家” + turn +“的转弯”; //在萤幕上说谁转动了
如果(document.getElementById(“ computer”)。checked && turn == 2){
computer = window.setTimeout(“ computerMove()”,random(500,3000)); //如果在玩计算机,它将随机超时以使其移动,因此不会立即发生。
}
}
}
函数computerMove(){
//将计算机标记放置在未使用的板上随机位置。
var tbl = document.getElementById(“ ttt”);
var row = random(0,2)
var col = random(0,2)
var place = tbl.getElementsByTagName(“ tr”)[row] .getElementsByTagName(“ td”)[col] .getAttribute(“ xo”);
while(place!= 0){
行=随机(0,2)
col = random(0,2)
位置= tbl.getElementsByTagName(“ tr”)[行] .getElementsByTagName(“ td”)[col] .getAttribute(“ xo”);
}
comp = 1;
setXO(row,col);
}
函数checkDraw(){
//检查是否所有地方都已满,没有找到获胜者。 (猫游戏)
var draw = true;
var tbl = document.getElementById(“ ttt”);
var rows = tbl.getElementsByTagName(“ tr”);
对于(i = 0; i <rows.length; i ++){
var cols = rows [i] .getElementsByTagName(“ td”);
对于(c = 0; c <cols.length; c ++){
如果(cols [c] .getAttribute(“ xo”)== 0){draw = false; }
}
}
if(draw){alert(“ Cats Game!”); resetGame(); 返回false; }
}
函数checkWinner(){
//检查获胜者
var tbl = document.getElementById(“ ttt”);
var check = new Array(23); //有24种可能的方式可以在井字游戏中赢得胜利,其中有横穿,横穿和对角线。 他们如下
var ps = new Array(2);
//记住这是从0开始而不是从1开始。
//因此在此数组(检查)中,我将按顺序获得3套。 集1将是check [0] check [1]和check [2],因此它说第一行(“ tr”)[0]第一个单元格(“ td”)[0]并保存其值
//接下来检查第1行(“ tr”)[1]和单元格1(“ td”)[1],然后检查第2行单元格2,所以现在check [0] check [1]和check [2]是标记相应区域的人的值。 这一切都有可能继续。
check [0] = tbl.getElementsByTagName(“ tr”)[0] .getElementsByTagName(“ td”)[0] .getAttribute(“ xo”); //第0行0列-此对角线从左上角到右下角
check [1] = tbl.getElementsByTagName(“ tr”)[1] .getElementsByTagName(“ td”)[1] .getAttribute(“ xo”); //第1行第1行
check [2] = tbl.getElementsByTagName(“ tr”)[2] .getElementsByTagName(“ td”)[2] .getAttribute(“ xo”); //第2行2
check [3] = tbl.getElementsByTagName(“ tr”)[0] .getElementsByTagName(“ td”)[2] .getAttribute(“ xo”); //第0行2行-从右上角到左下角开始对角线
check [4] = tbl.getElementsByTagName(“ tr”)[1] .getElementsByTagName(“ td”)[1] .getAttribute(“ xo”); //第1行第1行
check [5] = tbl.getElementsByTagName(“ tr”)[2] .getElementsByTagName(“ td”)[0] .getAttribute(“ xo”); //第2行0
check [6] = tbl.getElementsByTagName(“ tr”)[0] .getElementsByTagName(“ td”)[0] .getAttribute(“ xo”); //第0行col 0-这会直接向上和向下检查col 0
check [7] = tbl.getElementsByTagName(“ tr”)[1] .getElementsByTagName(“ td”)[0] .getAttribute(“ xo”); //第1行0行
check [8] = tbl.getElementsByTagName(“ tr”)[2] .getElementsByTagName(“ td”)[0] .getAttribute(“ xo”); //第2行0
check [9] = tbl.getElementsByTagName(“ tr”)[0] .getElementsByTagName(“ td”)[1] .getAttribute(“ xo”); //第0行col 1-这会直接向上和向下检查col 1
check [10] = tbl.getElementsByTagName(“ tr”)[1] .getElementsByTagName(“ td”)[1] .getAttribute(“ xo”); //第1行第1行
check [11] = tbl.getElementsByTagName(“ tr”)[2] .getElementsByTagName(“ td”)[1] .getAttribute(“ xo”); //第2行1
check [12] = tbl.getElementsByTagName(“ tr”)[0] .getElementsByTagName(“ td”)[2] .getAttribute(“ xo”); //第0行第2行-这将开始向上和向下检查第2行
check [13] = tbl.getElementsByTagName(“ tr”)[1] .getElementsByTagName(“ td”)[2] .getAttribute(“ xo”); //第1行2
check [14] = tbl.getElementsByTagName(“ tr”)[2] .getElementsByTagName(“ td”)[2] .getAttribute(“ xo”); //第2行2
check [15] = tbl.getElementsByTagName(“ tr”)[0] .getElementsByTagName(“ td”)[0] .getAttribute(“ xo”); //第0行0行-从左到右开始检查第0行
check [16] = tbl.getElementsByTagName(“ tr”)[0] .getElementsByTagName(“ td”)[1] .getAttribute(“ xo”); //第0行1
check [17] = tbl.getElementsByTagName(“ tr”)[0] .getElementsByTagName(“ td”)[2] .getAttribute(“ xo”); //第0行2
check [18] = tbl.getElementsByTagName(“ tr”)[1] .getElementsByTagName(“ td”)[0] .getAttribute(“ xo”); //第1行第0行-从左到右开始检查第1行
check [19] = tbl.getElementsByTagName(“ tr”)[1] .getElementsByTagName(“ td”)[1] .getAttribute(“ xo”); //第1行第1行
check [20] = tbl.getElementsByTagName(“ tr”)[1] .getElementsByTagName(“ td”)[2] .getAttribute(“ xo”); //第1行2
check [21] = tbl.getElementsByTagName(“ tr”)[2] .getElementsByTagName(“ td”)[0] .getAttribute(“ xo”); //第2行第0行-这将开始左右检查第2行
check [22] = tbl.getElementsByTagName(“ tr”)[2] .getElementsByTagName(“ td”)[1] .getAttribute(“ xo”); //第2行1
check [23] = tbl.getElementsByTagName(“ tr”)[2] .getElementsByTagName(“ td”)[2] .getAttribute(“ xo”); //第2行2
var b = 0
//而不是用一堆if语句检查每个人,这是我检查获胜者的方式
对于(i = 0; i <= check.length; i ++){
if(b == 3){//如果我们设置了数组ps的前3个,我们将检查获胜。
if(ps [0]!= 0 && ps [1]!= 0 && ps [2]!= 0){//确保所有3个都不为空
if(ps [0] == ps [1] && ps [1] == ps [2]){return win(ps [2]); } //在此循环中,它设置了一个由3个项目ps []组成的数组,现在记住它一次执行3个,因为井字游戏中有3行和3个列。 所以它把我们的前3种可能性汇总为check [0] check [1]和check [2],然后比较看那些地方是否有赢家,所以它说ps [0] == ps [1] && ps [1] == ps [2],因为如果0 = 1和1 = 2,则意味着所有3个标记均由同一玩家做出。
}
b = 0 //将变量重置为0,以便可以获取下3种可能性。
}
ps [b] =检查[i]; //将可能性设置为数组。
b ++; //只将1加到变量b
}
}
功能win(玩家){
document.getElementById(“ turn”)。innerHTML =“ <font size = '20'color ='red'>玩家” + player +“获胜!</ font>”; //简单地用红色大文字说出谁赢了!
document.getElementById(“ win”)。play(); //播放音频文件
var tbl = document.getElementById(“ ttt”);
var rows = tbl.getElementsByTagName(“ tr”);
for(i = 0; i <rows.length; i ++){//此循环将所有广告位设置为烟花,gif
var cols = rows [i] .getElementsByTagName(“ td”);
对于(c = 0; c <cols.length; c ++){
cols [c] .innerHTML =“ <img src ='fireworks.gif'>”;
}
}
活动=假; //告诉游戏不活跃的所有信息
返回false;
}
函数random(min,max){
//只是一个使随机数更容易的函数。
random_num = Math.round((Math.random()* max)+ min)
返回random_num
}
函数resetGame(){
//重置游戏
active = true; //告诉游戏正在进行的一切
document.getElementById(“ buttons”)。play(); //因为单击了一个按钮,所以播放音频文件。
转= 1; //设置轮到谁,1 =玩家1和2 =玩家2
comp = 0; //将comp设置为0
var tbl = document.getElementById(“ ttt”);
var rows = tbl.getElementsByTagName(“ tr”);
for(i = 0; i <rows.length; i ++){//将所有属性设置回0(此处没有人标记),并在原位置设置空白图像,因此不存在X或O
var cols = rows [i] .getElementsByTagName(“ td”);
对于(c = 0; c <cols.length; c ++){
cols [c] .innerHTML =“ <img src ='blank.gif'>”;
cols [c] .setAttribute(“ xo”,“ 0”);
}
}
updateTurn();
}
</ script>
<EMBED NAME =“ write” id =“ write” SRC =“ write.wav” LOOP = FALSE AUTOSTART = FALSE HIDDEN = TRUE MASTERSOUND>
<EMBED NAME =“ buttons” id =“ buttons” SRC =“ buttons.wav” LOOP = FALSE AUTOSTART = FALSE HIDDEN = TRUE MASTERSOUND>
<EMBED NAME =“ start” id =“ start” SRC =“ start.wav” LOOP = FALSE AUTOSTART = true隐藏= TRUE MASTERSOUND>
<EMBED NAME =“ win” id =“ win” SRC =“ win.wav” LOOP = FALSE AUTOSTART = FALSE HIDDEN = TRUE MASTERSOUND>
<body bgcolor =“#000000”>
<center> <font color =“ white”>播放器1:<img src =“ x.gif”>&nbsp;&nbsp;&nbsp;&nbsp; <font color =“ white”>播放器2:<img src =“ o。 gif“>
<br>
<table style =“ border-top:1px solid orange;边框左:1px solid orange; border-bottom:1px solid orange; border-right:1px solid orange;”> <tr> <td style =“ color:white ;“ align =“ center”> <b>游戏选项<tr> <td> <输入type =“ checkbox” id =“ computer” name =“ computer” onclick =“ resetGame();”> <span style =“ color: white;“>对战计算机</ span> <tr> <td align =” center“> <img src =” reset.jpg“ onclick =” resetGame();“ style =“ cursor:pointer;”> </ table>
<table border = 0 align =“ center” width =“ 400” height =“ 400” style =“ background:url('board.jpg');”>
<tbody id =“ ttt” name =“ ttt”>
<tr> <td width =“ 100” height =“ 100” onclick =“ setXO(0,0);”> <img src =“ blank.gif”> </ td> <td width =“ 100” height = “ 100” onclick =“ setXO(0,1);”> <img src =“ blank.gif”> </ td> <td width =“ 100” height =“ 100” onclick =“ setXO(0,2) ;“> <img src =” blank.gif“> </ td> </ tr>
<tr> <td width =“ 100” height =“ 100” onclick =“ setXO(1,0);”> <img src =“ blank.gif”> </ td> <td width =“ 100” height = “ 100” onclick =“ setXO(1,1);”> <img src =“ blank.gif”> </ td> <td width =“ 100” height =“ 100” onclick =“ setXO(1,2) ;“> <img src =” blank.gif“> </ td> </ tr>
<tr> <td width =“ 100” height =“ 100” onclick =“ setXO(2,0);”> <img src =“ blank.gif”> </ td> <td width =“ 100” height = “ 100” onclick =“ setXO(2,1);”> <img src =“ blank.gif”> </ td> <td width =“ 100” height =“ 100” onclick =“ setXO(2,2) ;“> <img src =” blank.gif“> </ td> </ tr>
</ tbody>
</ table>
<span id =“ turn”> </ span>
这是我用电脑播放器制作的井字游戏的示例。 附件包含与此相关的所有图像和音频文件。
---没有代码标签,因为它们导致帖子在此特定帖子上不可见-
From: https://bytes.com/topic/javascript/insights/730449-tic-tac-toe