html5论文.docx
- 文档编号：25340585
- 上传时间：2023-06-07
- 格式：DOCX
- 页数：14
- 大小：1.56MB
html5论文.docx
《html5论文.docx》由会员分享，可在线阅读，更多相关《html5论文.docx（14页珍藏版）》请在冰豆网上搜索。
html5论文
HTML5的研究综述
马升强
马升强
摘要：
2014年10月,HTML5的标准正式发布,距离发布时间已经有一年的时间,这一年多来出现了许多的HTML5开发的应用，同时也由于对HTML5不了解或者是由于浏览器兼容性等问题，让开发人员困惑要不要学习或者要不要使用HTML5做网站开发呢？
本文将对html5的特性,html5标签的浏览器兼容性,html5和xhtml的对比,以期通过介绍让大家对HTML5有个全面的认识,同时为广大的编程人员学习和使用提供帮助。
关键字：
HTML5新特性兼容性
一HTML5的特性
HTML5是面向应用的，较之前的版本增加了许多新的功能，让网站的网页更加丰富多彩。
下面我们就从以下6个方面展开HTML5特性的论述：
1绘图功能交互
HTML之前的版本中没有绘图功能，而HTML5新增了canvas标签，这样HTML5有了绘图功能。
这个标签提供了好比Photoshop中的画布，而Photoshop中的各种画笔、笔刷、渐变等功能，则通过canvas标签提供的JavaScriptAPI来提供，canvas提供的绘图功能不仅能够绘制图片，而且还可以通过setInterval等函数制作动画效果，进一步的通过JavaScript获取用户的行为，如鼠标点击等，制作游戏效果。
在移动端，Flash已经停止对移动端的开发，所以在绘制图片、制作动画方面，HTML5的绘图功能将会更加的大放异彩。
下面的图为canvas画布下绘制的图片：
图1：
:
canvas绘图效果
2离线存储
为了更好的支持web应用在本地存储数据的需求，HTML5更加了WebStorage功能，通过sessionStorage和localStorage两个对象来实现对web中数据的存储。
较之前也能保存在客户端的cookie来说，WebStorage更有优势，cookie的大小被限制在4kb，而sessionStorage和localStorage则可以存储5MB大小，甚至更大（不同的浏览器有差别），cookie通过http事务一起发送的，增加了带宽，而sessionStorage和localStorage则直接保存在客户端就好了，无需占用带宽。
下面为localStorage的示例代码：
vardata=newObject（）;
data.name=document.getElementById（‘name’）.value;
varstr=JSON.stringify（data）;
localStorage.setItem（data.name,str）;
alert（“数据已保存！
”）；
HTML5甚至增加了支持SQLLite的文件类型的SQL数据库，让用户的数据直接保存在本地的数据库中，进一步的减轻了服务器的负担和用户的流量，但是目前这一功能浏览器支持度不够高。
3WebWorker多线程处理
WebWorker是在HTML5中新增的、用来在Web应用程序中实现后台处理的一项技术。
使用这个JavaScriptAPI，开发人员可以很容易的创建在后台运行的线程（在HTML5中称为worker），如果将可能耗费较长时间处理交给后台去处理，对用户在前台页面中执行的操作就完全没有影响了，让用户的体验更加流畅。
HTML5创建后台线程的方式很简单，而且可以实现线程的嵌套和多个子线程之间的通信。
下面的代码展示了线程的创建和接收的机制：
varworker=newWorker（"work.js"）;/在HTML文档中创建线程
worker.postMessage（"halloworld"）;//发起一个消息给线程
onmessage=function（event）//在work.js里面可以接收到这个信息：
{
vardata=event.data;//接收到的信息赋值给data
close（）;//关闭线程
}
4离线应用程序
在web应用中使用本地缓存的原因之一是为了支持离线应用，所谓的离线应用，是指当浏览器无法上网时，web应用可以继续使用，而不影响正常的工作生活。
这里需要强调，本地缓存和浏览器网页缓存是有区别的，本地缓存是对整个web应用程序服务的，而浏览器网页缓存只服务于单个的网页，并且任何网页都可以进行浏览器网页缓存，而本地缓存只缓存那些你指定缓存的网页。
创建HTML5离线应用步骤如下：
（1）创建离线清单（manifest）
创建一个minifest格式的文件，在里面说明哪些资源需要离线缓存，哪些资源需要在线访问，如设置一个demo.manifest文件，代码如下：
CREATEMANIFEST
#需要离线缓存的文件
CACHE:
other.js
jQuery.js
#必须连接服务器在线访问的文件
NETWORK
ex.php
aaa.php
（2）配置服务器
在服务器中增加Mine类型，如需要在Apache服务器中的mine.types文件中添加如下内容：
text/cache-manifestmanifest
（3）获取manifest清单
需要在离线缓存的网页中指定manifest属性的manifest文件的URL地址：