本文实例讲述了Javascript实现五子棋游戏的方法。分享给大家供大家参考，具体如下：
最近半个月一直在看深入的学习Javascript，里面有很多重点和难点，比如闭包、词法分析、面向对象等。今天给大家分享一个由Javascript编写的五子棋游戏，主要用到Javascript的面向对象、事件委托、闭包等知识，还是挺有分量的，正好可以检测学习的成果。
老规矩，先上图，再说话。
效果图：
五子棋素材图：
代码：
HTML五子棋游戏 table{ border-collapse:collapse; width:540px; height:540px; border:solid 1px blue; margin:auto; background-image: url('./images/background.gif'); }
今天不知道怎么搞的，写博客的时候上传不了图片，还好我机智，把图片存到GitHub上，好了，来讲代码。首先，我必须先说明一下，我觉得代码还有很大的优化空间，感兴趣的同学可以继续研究。
实现思路：首先创建一个表格，共15行，15列，把背景改成棋盘的图片，给这个table添加onclick事件，这里使用到了事件委托，事件委托我在之前的文章有介绍过，感兴趣的同学可以去看看。去调用xiaQi函数，在下棋函数中，先判断选择的位置是否已经下过棋了，使用闭包获取下一个棋子的颜色，然后调用judge函数，在函数中先获取当前棋子所下的位置，遍历255个棋格，看看是否能赢，判断是否五子连珠，如果有则游戏结束。
PS：这里再为大家推荐另一款本站的js版五子棋游戏供大家参考（其AI相对简单一些）
在线五子棋游戏：
http://tools.jb51.net/games/wuziqi
更多关于Javascript相关内容感兴趣的读者可查看本站专题：《Javascript数据结构与算法技巧总结》、《Javascript数学运算用法总结》、《Javascript切换特效与技巧总结》、《Javascript查找算法技巧总结》、《Javascript动画特效与技巧汇总》、《Javascript错误与调试技巧总结》及《Javascript遍历算法与技巧总结》
希望本文所述对大家Javascript程序设计有所帮助。
