前端canvas——五子棋小游戏开发

这估计是最后一篇了，终于是修复了部分bug——隔一个空格能够胜利的bug，并且添加了部分样式。

其他bug目前还没有找到，找到再说吧。

大部分代码请见：

用canvas实现五子棋小游戏https://blog.csdn.net/m0_54066656/article/details/140552576?spm=1001.2014.3001.5501

这里面最重要的，就是胜利代码的逻辑了。

别的样式都可以自定义，根据自己所学的知识进行自定义即可。

下面给出我自己的一些自定义设置以及完善：

首先就是，一进入到网页就提示你是否选择新游戏。

这个可有可无，看你喜不喜欢花里胡哨的东西。

然后就是提示，下棋子的提示，上图上层第二个黑点左侧有白色虚线圆框。

这个做起来还是蛮有难度的，喜欢的可以去挑战一下自己。

下面这个也是跟上面这个是一样的：

悄咪咪说一句，这个也是我看了B站大佬视频里面的样式，我才开始弄的。

我一开始以为后续会教你如何实现，但是没有，只教了模糊。

快乐啪一下没了，于是乎就花了亿点时间去实现了，整体还是蛮简单的。

最后就是游戏胜利的画面，我根据颜色来进行了深度定制。

比方说，黑方胜利了，那就使用黑色背景，如果是白方胜利了，那就采用白色背景。 

这部分还是很简单的，建议自己动手尝试。

悄咪咪说一句，你可以使用第一张图里面提供的DOM元素进行~

这就是以上所有内容，感谢你的阅读，咱们下棋整活再见。 

整活：

有能力的，可以加个AI对战。

有心情的，可以换个校对方法，压缩代码。