求html5的离线手册

html-css013

求html5的离线手册,第1张

在这篇文章中,我们将展示如何创建乖巧离线的网页和应用程序使用下面的HTML5功能:

AppCache本地存储文件资源,离线访问它们作为URL

索引型数据库存储结构化数据在本地,你可以访问和查询它

DOM存储在本地存储少量的文字信息,

离线事件来检测,如果你€ 重新连接到网络

例:随时随地访问数据的离线支持

让我们€™的说,你去购物,从您 最喜爱的食品网站 的配方的打印输出,但是当你€™重新在市场上,你塔卡纳€™吨找到一些关键的成分。

试想一下,当你在家中使用移动PC浏览 食谱网站 ,部分网站会自动下载离线使用。这可以让你把你的手机PC到店,访问该网站,并在市场寻找一个新的配方。 最好的部分 是,你可以做到这一点, 而 被连接到网络。作为一个消费者,您的网站感激,因为它只是工作时,你需要它。

离线的'蛋糕'这个词使用的食谱网站的搜索结果。

作为一个开发者,你可以使这些类型的场景相结合的离线技术: AppCache ,索引型数据库 , DOM存储 , WebSockets的 (或 XHR )。 在探索个人的技术,让我们的探讨的好处。

Metro风格的应用程序和网站,离线技术让你来处理连接故障。想象一下,您的用户填写一个表格,他失去网络连接。您的网站或Metro风格的应用程序应该怎么做呢?连接自由发展的心态可以让您的应用程序是否连接到网络或不正确地独立工作。你的应用程序将正常工作。

在更复杂的情况下,Web站点和应用程序允许用户创建新的内容,并存储新的数据,即使应用程序是完全脱机。试想一下,无缝地工作在脱机状态下,如Outlook今天的Outlook Web Access(OWA)的Hotmail或GMail。

离线技术也可以通过本地缓存的资源服务,预缓存将来信息和转移从云(或网络)到客户端设备的处理能力,提高整体性能。信息越多,你€™重新能够缓存在本地,在本地搜索,并计算在本地服务器和用户的体验将更快,需要更少的资源热转印机 。

有一个Metro风格的应用程序离线工作的期望高于网站的脱机工作。因为他们使用从商店的自我包含的程序包部署,用户希望他们有某种类型的离线功能(如游戏,书籍,食谱等)。即使这些应用程序是无法创建或访问新的内容,以前的内容应该是可见的(例如联系人,会议,饲料,杂志等)。

本地缓存文件资源使用AppCache

AppCache使您能够创建长寿命的本地缓存下载的文件资源,资源可以访问而离线或使用的同时在线,以提高性能。试想一下,一个三岁的孩子使用一台笔记本电脑,下载一个交互式的Web的游戏(KidsBook)从您的家庭网络。如果应用程序的资源存储在本地,孩子可以继续在车上玩游戏,那里没有网络连接。

如果KidsBook使用AppCache,本场比赛将有缓存必要的资源(的JavaScript,HTML,CSS,音频,视频等)时,先下载后从网络上断开时,播放的游戏。这可以让孩子保持愉悦,即使设备本身没有网络连接。

AppCache创作流程。

要看到如何启用互动网页游戏脱机工作,检查出 KidsBook的 IE Test Drive网站 上的例子。

AppCache使用一个manifest文件,以缓存的内容从网站上指定资源的URI。幕后发生后,浏览器显示网页,它允许在清单文件中定义的资源被下载的缓存。这保证了资源下载到本地机器上,作为一个单位在一个事务中,创建一个本地的缓存。如果一个单一的资源下载失败,没有创建高速缓存。要更新存储在缓存中的内容,在您的服务器更新清单文件。当用户下次访问该网站时,浏览器比较明显的服务器上的文件的缓存副本。如果缓存的舱单副本是不同的服务器副本,新版本更新清单文件中定义的内容高速缓存的使用。

AppCache还允许Internet Explorer和Metro风格的应用程序在脱机状态下使用传统的URL的访问缓存的资源。这可以让你在浏览器窗口中键入一个URL,并没有任何网络连接的情况下访问此信息。此外,脱机页可以解决的URI使用本地缓存的信息。代码示例来看看在 HTML5应用程序缓存(“œAppCacheâ) 部分中的 IE10开发人员指南 。

总体而言,AppCache提供了一定的优势HTTP的缓存。HTTP缓存没有吨保证缓存的资源之后将TIF(临时Internet文件)将被清除。此外,HTTP缓存没有€™吨正确地解决在脱机状态下的URL。然而,HTTP缓存可用于优化AppCache的行为,通过指定的缓存资源的生命周期。如果从网站上下载或复制的资源从缓存的本地高速缓存中创建一个新的版本时,这将决定。

Metro风格的应用可以受益于AppCache通过在本地缓存的Web资源的访问的页框,它允许脱机访问的内容。

高速缓存大型本地使用索引型数据库的结构化数据

索引型数据库 是一个本地JavaScript对象存储在本地机器上的数据库,允许快速索引和搜索的对象。前面介绍的 食谱网站, 包括16食谱从父站点中提取的数据库。想象一下,用一个RSS feed,一个WebSocket或XHR连接的,定期更新这个数据库。这将使您的用户能够访问到最新的食谱,即使他们有没有网络连接。

索引型数据库,您可以直接操作和索引的JavaScript对象。使用索引型数据库搜索本地信息的优点是它不会强迫你总是在云中搜索,降低了计算成本。这是假设你€™重新能够维持,是缓存在本地系统中的数据的相关性。

一、《Web前端开发最佳实践》

这本书是前端开发领域的经典之作,是一本扎实前端基本功,规范我们前端代码的实践性书籍。本书主要讲解了HTML、CSS、Javascript以及移动端开发的最佳实践方案,能够对缺乏良好指导的开发者产生很大的帮助。通过阅读本书我们可以掌握如何编写高可读性、高维护性、高性能的HTML、CSS以及Javascript。

二、《CSS那些事儿》

内容介绍:《CSS那些事儿》是2009年电子工业出版社出版的图书,作者是林小志。该书通过对CSS技巧实例进行讲解,浅入深地分析了CSS相关知识。

通过页面中的文字、图片、表格、表单等常见元素的处理及各种页面布局方式的使用,使读者能深入了解到如何在页面中更好地运用CSS布局。尤其是在页面布局的部分中,全面分析了多种布局方式,着重分解了两列等高和三列等高的几种方式,并相应说明了等高布局的优缺点。

三、《CSS权威指南》

内容介绍:《CSS权威指南》通过诸多示例,详细讲解了如何做到仅在一处建立样式表就能创建或修改整个网站的外观,以及如何得到html力不能及的更丰富的表现效果。同时展示了如何遵循css最新规范(css2和css2.1)将层叠样式表的方方面面应用于实践。

四、《JavaScript 标准参考教程》阮一峰

内容介绍:阮一峰 本书全面介绍 JavaScript 核心语法,从最简单的开始讲起,循序渐进、由浅入深,力求清晰易懂。所有章节都带有大量的代码实例,便于理解和模仿,可以用到实际项目中,即学即用。 本书适合初学者当作JavaScript语言的入门教程,也适合当作日常使用的参考手册。

五、JavaScript高级程序设计第三版

内容介绍:《全书从JavaScript 语言实现的各个组成部分——语言核心、DOM、BOM、事件模型讲起,深入浅出地探讨了面向对象编程、Ajax 与Comet 服务器端通信,HTML5 表单、媒体、Canvas(包括WebGL)及Web Workers、地理定位、跨文档传递消息、客户端存储(包括IndexedDB)等新API,还介绍了离线应用和与维护、性能、部署相关的最佳开发实践。

六、锋利的jquery

内容介绍:《锋利的jQuery(第2版)》循序渐进地对jQuery的各种函数和方法调用进行了介绍,读者可以系统地掌握jQuery的选择器、DOM操作、事件和动画、AJAX应用、插件、jQuery Mobile、jQuery各个版本变化、jQuery性能优化和技巧等知识点,并结合每个章节后面的案例演示进行练习,达到掌握核心知识点的目的。

七、HTTP权威指南

内容介绍:《HTTP权威指南》由古尔利所著,《HTTP权威指南》详细解释了如何用HTTP来开发基于Web的应用程序,核心的[因特网协议,如何与架构构建块交互,如何正确实现因特网客户和服务器等。

《HTTP权威指南》的中心内容是HTTP,本质是理解Web的工作原理,以及如何将这些知识应用到Web编程和管理之中,主要涵盖HTTP的技术运作方式、产生动机、性能和目标以及一些相关技术问题。 《HTTP权威指南》适合所有想了解HTTP和Web底层结构的人阅读。

八、高性能网站建设指南

内容介绍:《高性能网站建设指南》结合Web2.0以来Web开发领域的最新形势和特点,介绍了网站性能问题的现状、产生的原因,以及改善或解决性能问题的原则、技术技巧和最佳实践。重点关注网页的行为特征,阐释优化Ajax、CSS、JavaScript、Flash和图片处理等要素的技术,全面涵盖浏览器端性能问题的方方面面。