微客导航 » 文章资讯 » 原生JS+Canvas实现五子棋游戏

原生JS+Canvas实现五子棋游戏

2023-09-26 21:01:06 137

本文实例为大家分享了JS Canvas实现五子棋游戏的具体代码，供大家参考，具体内容如下





五子棋

canvas{
display:block;
margin:50pxauto;
box-shadow:-2px-2px2px#efefef,5px5px5px#b9b9b9;
cursor:pointer;
}
.btn-wrap{
display:flex;
flex-direction:row;
justify-content:center;
}
.btn-wrapdiv{
margin:010px;
}
div>span{
display:inline-block;
padding:10px20px;
color:#fff;
background-color:#EE82EE;
border-radius:5px;
cursor:pointer;
}
div.unablespan{
background:#D6D6D4;
color:#adacaa;
}
#result-wrap{text-align:center;}



--益智五子棋--



重新开始

悔棋

撤销悔棋

varover=false; varme=true;//我 var_nowi=0,_nowj=0;//记录自己下棋的坐标 var_compi=0,_compj=0;//记录计算机当前下棋的坐标 var_myWin=[],_compWin=[];//记录我，计算机赢的情况 varbackAble=false,returnAble=false; varresultTxt=document.getElementById('result-wrap'); varchressBord=[];//棋盘 for(vari=0;i<15;i++){ chressBord[i]=[]; for(varj=0;j<15;j++){ chressBord[i][j]=0; } } //赢法的统计数组 varmyWin=[]; varcomputerWin=[]; //赢法数组 varwins=[]; for(vari=0;i<15;i++){ wins[i]=[]; for(varj=0;j<15;j++){ wins[i][j]=[]; } } varcount=0;//赢法总数 //横线赢法 for(vari=0;i<15;i++){ for(varj=0;j<11;j++){ for(vark=0;k<5;k++){ wins[i][j+k][count]=true; } count++; } } //竖线赢法 for(vari=0;i<15;i++){ for(varj=0;j<11;j++){ for(vark=0;k<5;k++){ wins[j+k][i][count]=true; } count++; } } //正斜线赢法 for(vari=0;i<11;i++){ for(varj=0;j<11;j++){ for(vark=0;k<5;k++){ wins[i+k][j+k][count]=true; } count++; } } //反斜线赢法 for(vari=0;i<11;i++){ for(varj=14;j>3;j--){ for(vark=0;k<5;k++){ wins[i+k][j-k][count]=true; } count++; } } //debugger; for(vari=0;imax){ max=myScore[i][j]; u=i; v=j; }elseif(myScore[i][j]==max){ if(computerScore[i][j]>computerScore[u][v]){ u=i; v=j; } } if(computerScore[i][j]>max){ max=computerScore[i][j]; u=i; v=j; }elseif(computerScore[i][j]==max){ if(myScore[i][j]>myScore[u][v]){ u=i; v=j; } } } } } _compi=u; _compj=v; oneStep(u,v,false); chressBord[u][v]=2;//计算机占据位置 for(vark=0;k

更多有趣的经典小游戏实现专题，分享给大家：

C++经典小游戏汇总

python经典小游戏汇总

python俄罗斯方块游戏集合

JavaScript经典游戏玩不停

javascript经典小游戏汇总

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

返回顶部
3162201930
czq8825@qq.com

原生JS+Canvas实现五子棋游戏

热门推荐

随机推荐