摘 要

随着智能手机的普及，对于移动互联网的各种服务层出不穷，网络教育在普及教育方面被世界所认可和接受，自学充电开始变为一种潮流。知识更替变快，可以说每个人都需要不停地充实提升自己。但目前主流的还是纸质考试模式，随着社会分工变得更细，需要的测试会变得越来越多，传统的练习模式在效率上可能就不如在线教育模式。

本文所描述的工作内容主要包含以下几个方面：简单介绍了课题的目的和意义，以及国内外对于该课题的研究现状；简单介绍了本课题所用到的技术方案，如HTML5，MUI和Wilddog等；然后根据测试驱动开发的思想，通过各个功能的测试用例设计代码，测试并完成功能，不断迭代增加功能，最终实现了在PC端和手机端浏览器上可以使用的练习系统。本课题的研究成果包含了用户的注册和登陆功能、练习与测试功能、主观题的判断功能、还有错题收集的功能。

关键词：HTML5；练习系统；Wilddog；测试驱动开发；

Abstract

With the popularity of smart phones, mobile Internet services for emerging, computer education is also becoming more common, Learning something on Internet become a form of modern education indispensable. And social demand for talent makes a variety of targeted examinations more and more traditional forms of exercises and exam was not very convenient. The development of mobile network technology to make up for the lack of traditional forms of education, it has great prospects.

The work done by this paper is: introducing the background, significance and the research progress of related topics as well as abroad; the key technology used in the system, such as HTML5, MUI Wilddog and so on; and then based on test-driven development thinking through the various functional test case design code, test and complete function, and constantly increase the iterative function, and ultimately the online training system on the mobile browser can use. The main achievement of the user registration and login, exercise judgment and testing, subjective questions, collect the wrong questions.

Key Words: HTML5, Practice Online,Wilddog,Testing-Driven Development.

目录

摘要 I

Abstract II

第1章 绪论 1

1.1课题目的和意义 1

1.2 研究现状 1

1.3本文所做的主要工作及论文结构 2

第2章 关键技术 3

2.1 HTML5 3

2.2 JavaScript 3

2.3 MUI 3

2.4 Wilddog 4

2.5 NOSQL 4

2.6 测试驱动开发 5

第3章 需求分析 6

3.1可行性分析 6

3.1.1环境可行性分析 6

3.1.2技术可行性分析 6

3.2功能性需求分析 6

3.3用例分析 7

第4章 系统设计 9

4.1概要设计 9

4.2原型设计 10

4.3 系统设计原则 13

4.4数据库设计 14

4.4.1 NOSQL与传统关系型数据库的区别 14

4.4.2练习系统数据库的设计 15

第5章 测试及实现 19

5.1测试用例编写 19

5.2迭代实现 21

第6章 总结 29

参考文献 30

致谢 31

第1章 绪论

1.1课题目的和意义

随着智能手机的普及，手机依据其自身的便携，极大地方便了人们的生活，涉及到衣食住行用等方方面面。但目前在教育方面，我们的练习题大多还是在纸质练习本上做的，课后练习和自我测试显得不是那么便捷。而且社会对人才的需求使得各种考试越来越多，传统的练习与考试形式可能有那么点拖节奏的感觉。网络技术说不定可以在教育方面发挥巨大的作用。

传统练习模式是学生需要用作业本抄题目然后解答的形式，往往需要花掉很多不必要的时间去做重复的抄题目的工作，并且效率还不高，还需要花费大量时间和精力。由于大部分工作都具有重复性，计算机程序足以完成，还能节省学生大量的课后时间，提高学习效率。本课题研究目的是将工作转移到移动端，同时也节省了空间，更加便捷。

通过研究这种在线练习系统，可以让课后练习活动更加现代化，也可以提高教学效率。让学生有更多的时间花在思考问题上而不是抄题目。

1.2 研究现状

网络技术的带动下迅速发展中。再加上HTML5的发展，网页在移动端的展示越来越丰富和完善，可以推动在线练习系统的移动化和便捷化。

在国内，就我接触到的来看，有针对求职人员的在线笔试系统，也可以用练习系统来提前做好准备。还有针对机动车驾驶员理论考试相关的题库练习系统及自我测试。就这方面来看，有针对性的练习系统比传统的看书记忆知识点来的高效。

还有针对驾驶员的理论考试，对于理论考试，传统的练习模式是看相关书籍，然后记忆知识点，准备考试。现在可以用手机或者PC端的学习系统学习理论知识，如驾考宝典。极大提高了应试者的学习效率，让通过驾驶员理论考试变得更加容易和快捷。

在国外，有大量的在线教育机构，如MOOC。世界各地的大学及老师们会让教学视频上传，供全世界的学生学习观看。视频中的老师会在每节课结束后留下本课的相关练习题，学生可以在家里完成。在线教育和练习可以让全世界的学生听名师讲课、分享学习经验，完成作业。MOOC 让教育不受地域限制，也是很好的研究发展方向。

1.3本文所做的主要工作及论文结构

本文通过采用HTML5，利用JavaScript、MUI等技术，结合Wilddog的nosql数据库。

本文第一章是绪论，主要介绍课题的背景、意义以及国内外的研究背景。

本文第二章为开发练习系统需要使用的关键技术。主要介绍了关键技术的应用和特点，如HTML5，MUI，Wilddog等。

本文第三章为对练习系统的需求分析。主要介绍了在线考试与练习系统的用例分析、可行性分析、功能分析和描述等。

本文第四章为在线练习系统的总体设计。主要介绍了系统主要功能设计、原型设计、设计原则和数据库设计。

本文第五章为在线练习系统的详细设实现和界面展示。主要介绍了测试驱动的实现过程。

第2章 关键技术

2.1 HTML5

现在网页大多是针对PC端浏览器的设计，在手机浏览器上的内容展示不是很好。但是随着智能手机的普及，手机变成了网络生活方式的主流，大部分业务都需要在手机端完成，所以HTML5就变得流行起来。

HTML5和原来的HTML内容相比，增加header、footer等元素，还增加了许多 API，如支持本地储存，离线 Web 应用，支持二维图像绘制 ，支持视频播放，支持地理定位等，所以视频和音频在手机端的展示会变得更好。动画实现变得简单，人机交互会变得更人性化。

而且现在微信公众号的普及，让HTML5成为了新媒体不可或缺的工具，在内容的展示和读者的交流方面，会变得更加快捷和高效。

2.2 JavaScript

随着HTML5在PC和移动端越来越流行，JavaScript变得更加重要了。而且，新兴的Node.js把JavaScript引入到了服务器端，JavaScript已经变成了适合网页开发的全能语言。

JavaScripts是一种基于对象的客户端脚本语言，基本上所见到的网页显示动画实现都用到了JavaScript，以及现在发展迅速的很多基于HTML5的移动端App，其中的交互逻辑都是基于JavaScript。Java Script 是事件驱动的，满足了前端开发交互页面的需要。

也可以把JavaScript看做是一种运行在浏览器中的解释型的编程语言，而且在Web设计方案中，只有JavaScript能做到跨平台、跨浏览器处理网页之间、元素之间的逻辑，以及处理用户交互响应输入。

2.3 MUI

MUI是一个前端框架，把一些常用的窗体操作封装了。HTML系列的默认控件样式很少而且不够美观，想要自己制作一个常见的控件也不知道怎么下手，MUI框架封装的UI元素正好解决了这些问题，提供了很多可供使用的交互动作和美观的UI元素。