今天心血来潮，想搞个小游戏玩玩，就叫它“box游戏”。就是一个简单的推箱子游戏，琢磨着自己动手，从头到尾体验一把。
准备工作
先得有个“舞台”，我用最简单的 HTML 搭个框架，就是一个个格子组成的区域，用来放箱子和目标地点。
然后就是画格子，用的是 div 元素，设置一下宽高和背景颜色，一个格子就出来。得给它们排排队，用上 CSS 的 flex 布局，这样就能整整齐齐地排列起来。
让箱子动起来
接下来就是关键，怎么让箱子动起来？这得用到 JavaScript 。我先给每个格子都编个号，这样就能知道箱子在哪，要推到哪。
小编温馨提醒：本站只提供游戏介绍，下载游戏推荐89游戏，89游戏提供真人恋爱/绅士游戏/3A单机游戏大全，点我立即前往》》》绅士游戏下载专区
然后监听键盘事件，按下上下左右键的时候，判断箱子能不能移动。比如，前面是空格子，那就能推过去；前面是墙或者另一个箱子，那就推不动。这些都要写代码来判断。
移动的时候，就是改变箱子所在格子的编号，同时更新格子的样式，看起来就像箱子真的移动一样。
判断游戏结束
总得有个输赢。我的想法是，当所有的箱子都推到目标地点的时候，游戏就结束。这也要写代码来判断。每次移动箱子后，都检查一下是不是所有箱子都在目标位置。
- 如果都到位，那就弹出一个提示框，告诉玩家“你赢！”。
遇到的坑
做起来才知道，看着简单，还挺麻烦的。比如，一开始没考虑到边界情况，箱子推到墙外面去，这可不行，得加判断。
还有就是，怎么判断箱子前面是空格子还是墙，这也花我一些时间去琢磨。后来发现，给每个格子都设置一个类型，比如“空格子”、“墙”、“箱子”、“目标”，这样就好判断多。
最终效果
经过一番折腾，总算是把这个小游戏给做出来。虽然很简单，但玩起来还挺有意思的。看着自己写的代码让箱子动起来，还是挺有成就感的。
这回的实践经历，让我体会到，东西看起来简单不代表做起来也容易，必须自己动手从头到尾的走一遍整个实践过程，才能有更深刻的体会，以后遇到问题，才能够独立自主的去解决。
