HTML5新特性功能之浅析.docVIP

HTML5新特性功能之浅析 　　摘 要：HTML5是近十年来Web开发标准巨大的飞跃。和以前的版本不同，HTML5并非仅仅用来表示Web内容，它的新使命是将Web带入一个成熟的应用平台，在HTML5平台上，视频、音频、图像、动画，以及同电脑的交互都被标准化。 　　关键词:HTML5;WebSocket;Web storage API;定位;canvas 　　中图分类号：TU-022文献标识码：A 　　引言 　　HTML 指的是超文本标记语言 (Hyper Text Markup Language)是为网页创建和其它可在网页浏览器中看到的信息设计的一种标记语言，它是目前网络上应用最为广泛的语言，也是构成网页文档的主要语言。 　　一、HTML5的发展 　　旧的HTML版本是10年之前制定的，在表达和应用上已经很难满足开发人员和使用者的需求。为了适应这快速发展的Web技术以及不断提出的Web应用需求，HTML5应运而生。2008年1月22日，第一份正式HTML5草案公布，并于2010年9月正式向公众推荐，2012年12月17日，万维网联盟（W3C）正式宣布凝结了大量网络工作者心血的HTML5规范已经正式定稿。 　　目前，在PC上，支持Html5的浏览器包括Firefox（火狐浏览器），IE9及其更高版本，Chrome（谷歌浏览器），Safari，Opera等，其中Chrome支持度是最好的；国内的傲游浏览器（Maxthon），以及基于IE或Chromium（Chrome的工程版或称实验版）所推出的360浏览器、搜狗浏览器、QQ浏览器、猎豹浏览器等国产浏览器同样具备支持HTML5的能力。在手机平台上，苹果iPhone、谷歌Android以及WindowsMobile上的Zetakey也支持HTML5的许多功能。在网页应用上，国外的YouTube以及国内的优酷等主要音视频网站都己经开始支持HTML5形式的音视频媒体。此外在许多网页上也实现了绘图、动画等一些在RIA中才会出现的应用，其实现的效果并不比用RIA实现来的差。而HTML5之所以能如此迅速的发展，得益于它的新标签和新特性。 　　二、HTML5的新特性 　　（一）语法精简 　　相较于HTML4, HTML5语言更加精简，解析的规则更加详细，在针对不同的浏览器即使语法错误也可以显示出同样的效果。HTML5取消了HTML4.01的一部被CSS取代的标记，提供了新的元素和属性。 　　（二）Web Socket 　　WebSocket是HTML5规格中的一个非常重要的新特性，这个新特性实现了数据的实时传送，可以允许用户在浏览器中实现双向通信，实现数据的及时推送，使得服务器与客户端、浏览器之间能够双向连接，自到明确关闭该连接才断开。在这之前，用户需要获取新的信息必须频繁的刷新页面才能达到要求。新的数据是要通过这种刷新的方式才能够显示在用户的浏览器上。而有了WebSocket这个技术后，我们可以实现及时通信，不需要刷新页面，数据会自动的由服务器发送到用户的浏览器上，用户可以及时的看见新的数据信息，这就大大扩展了网页自动获取新数据的功能。 　　（三）画布功能 　　在以往的浏览器上，用户想要直接在网页上进行绘图还是不能轻易完成的，即使是几何图形也不可以。在浏览器当中直接能跟图片的交互操作也很有限，多数是保存和点击。如果希望能够跟图片进行更多的操作或者在浏览器当中画出图形，就需要flash, Silverlight 这类插件来帮忙。 　　（四）离线存储 　　传统的客户端存储方式有cookie, Firefox下的global Storage , Flash插件自己的存储方式，但是这几种方式都有其局限性(安全性和兼容性)，所以HTML5提出了自己的数据存储方式Web Storage API，这种存储方式和cookie很相似。它的工作原理就是采用了离线缓存，生成一个清单文件（manifest file），这个清单文件实质就是一系列的URL列表文件，这些URL分别指向页面当中的HTML，CSS，JavaScript,图片等相关内容。当使用离线应用时，应用会引入这一清单文件，浏览器会读取这一文件，下载相应的文件，并将其缓存到本地。例如在飞机上或火车驶入隧道的情况下，由于封闭室内环境的限制，使得基于网络连接的Web应用受到制约，HTML5的离线存储功能就可以很好地解决这个问题。用户可以通过本地缓存正常使用Web应用，浏览器一旦读取这个文件，就会下载相关资源并缓存在本地，保证用户离线后仍然可以访问。当连接到网络后，再同步到Web上，并自动在这些本地缓存的副本改变时更新。 　　（五）智能表单 　　表单是网页中非常重要的一个组成部分，它的主要功能是用来搜集数据并且提交到