2 关键技术

2。1 HTML5

HTML5 是万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言（HTML） 的第五次重大修改。H5 赋予网页更好的意义与结构，更加丰富的标签将随着对 RDFa 的微

数据与微格式等方面的支持，构建对程序、对用户都更有价值的数据驱动的 Web[1]。2014 年 10 月 29 日，万维网联盟宣布该标准规范制定完成[2]。

2。2 Javascript

JavaScript 一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置 支持类型。它的解释器被称为 JavaScript 引擎，为浏览器的一部分，广泛用于客户端的 脚本语言，最早是在 HTML（标准通用标记语言下的一个应用）网页上使用，用来给 HTML 网页增加动态功能[3]。

2。3 Canvas

Canvas 是 HTML5 中的新元素，可以使用 javascript 用它来绘制图形、图标以及其他 任何视觉性的图像，它也可以用于创建图片特效和动画[4]。

3 需求分析

3。1 技术可行性分析

本系统的设计要求是一个能在 Window7 操作系统下运行且界面美观运行稳定。综合考 虑选择 html5 以及 Javascript 技术来实现本系统。同时 HTML5 和 javascript 语言也拥有 相当多的技术人员，可以说在技术方面没有太大问题。

3。2 经济可行性分析

随着电脑和手机的普及，类似飞机大战这样的小游戏也随之普及，所以用户需求会不 断上升。而且此游戏内存小，它的运行的平台 Window7 系统还是免费的，所以开发此游戏 的成本并不会很高。因此此游戏具有可观的经济效益。

3。3 操作可行性分析

对于这个游戏，它的操作只需要移动鼠标就可以实现，因此此游戏的操作简单易记， 操作是不会有问题的。 用户的用例图如图 3-1 所示。

图 3-1 用户用例图

4 系统设计

4。1 系统设计目标来自优I尔Y论S文C网WWw.YoueRw.com 加QQ7520~18766

根据需求分析中用户的需求和系统的功能，系统的目标如下所示。 1。稳定性

系统采用 JS 技术进行开发，完全保障了系统运行的稳定性。 2。安全性

这是用户最关心的问题，只有安全的系统，用户才能放心的进行游戏。

4。2 系统功能设计

系统主要用于前端实现，主要实现的功能如下所示。 1。登录游戏 在前端登录界面输入账号以及密码进入游戏。 2。运行游戏

首先进入欢迎界面，然后进入游戏泳子弹攻击敌方飞机或者用自己的飞机去撞击敌方 飞机，飞机分为小、中、大三种，打落或撞击一架飞机获得对应的分数，直到自己的飞机 的生命值为 0 时结束本局游戏。

3。暂停游戏 当鼠标移出画布的界面时，暂停游戏。 4。结束游戏

我方飞机的生命值为 0 时结束游戏。

系统的总体框架如图 4-1 所示。

图 4-1 系统的总体框架图

5 系统实现

5。1 用户登录界面

用户登录界面如图 5-1 所示。

图 5-1 用户登录界面

5。2 游戏界面布局