Casss1的博客

原创 纯前端JS实现五子棋游戏

在系统初始化时为每一格位置使用dom操作进行创建div 并添加点击事件，其中需要为每一个格子赋予唯一的id，我用的方法为A1，A2，.... B1，B2......O15。很简单的一个五子棋效果，有很多可以改进的部分，例如寻找左面子时候如果直接找到五个就可以提前结束游戏了，或者添加一些游戏记录等，欢迎给位指正、讨论。接下来就是最核心的获胜判定部分，我采用的方法，以横向判定为例先寻找当前落子点位最左面的相同色子，在依次向右寻找五格，若均为同色，则判断获胜。首先html页面中有一个基础的棋盘和胜利后的遮罩。