HTML5

HTML5现在已经不是SGML的子集,主要是关于图像,位置,存储,多任务等功能的增加。
绘画canvas
用于媒介回放的videoaudio元素
本地离线存储localStorage长期存储数据,浏览器关闭后数据不丢失
sessionStorage的数据在浏览器关闭后自动删除

语义化更好的内容元素,比如articlefooterheadernavsection
表单控件:calendardatetimeemailurlsearch
新技术:webworkerwebsocketGeolocation

移除的元素:
纯表现的元素:basefontbigcenterfontsstrikettu
对可用性产生负面影响的元素:frameframesetnoframes

支持HTML5新标签:
IE8/IE7/IE6支持通过document.createElement方法产生的标签,可以利用这一特性让这些浏览器支持HTML5新标签,浏览器支持新标签后,还需要添加默认的样式。
也可以直接使用成熟的框架,如html5shim

<!--[if lt IE 9]>
    <script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script>    
<![endif]>

区分HTML5,:DOCTYPE声明,新增的结构元素,功能元素等

在用户没有联网时,可以正常访问站点或应用;在联网的情况下,更新用户机器上的缓存文件。
原理:HTML5的离线存储是基于一个新建的.appchache文件的缓存机制(不是存储技术),通过这个文件上的解析清单离线存储资源,这些资源就会像cookie一样被存储下来。之后当网络处于离线状态时,浏览器会通过被离线存储的数据进行页面展示。

如何使用:
1、页面头部加入一个manifest的属性
2、在cache.manifest文件的编写离线存储的资源
3、在离线状态下,操作window.applicationCache进行需求实现

在线的情况下,浏览器发现html头部有manifest属性,它会请求manifest文件,如果是第一次访问app,浏览器会根据manifest文件的内容下载相应的资源并且进行离线存储。
如果已经访问过app,并且资源已经离线存储,浏览器会使用离线的资源加载页面,然后浏览器会对比新的manifest文件,如果文件没有发生改变,就不做任何操作,否则就会重新下载文件中的资源并进行离线存储。
离线的情况下,浏览器直接使用离线存储的资源。

cookie是网站为了标识用户身份而存储在用户本地终端上的数据(通常经过加密)
cookie数据始终在同源的http请求中携带(即使不需要),就会在浏览器和服务器间来回传递
sessionStoragelocalStorage不会自动把数据发给服务器,仅在本地保存

存储大小:
cookie数据大小不能超过4k
sessionStoragelocalStorage虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大

有效时间:
localStorage存储持久数据,浏览器关闭后数据不丢失,除非主动删除数据
sessionStorage数据在当前浏览器窗口关闭后自动删除
cookie设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭

给不想要提示的form或某个input设置为autocomplete=off

WebSocketSharedWorkder
也可以调用localStoragecookies等本地存储方式
localStorage另一个浏览上下文中被添加、修改或删除时,它都会触发一个事件,通过监听事件,控制它的值来进行页面信息通信

Adobe Flash Socket
ActiveX HTMLFile(IE)
基于multipart编码发送XHR
基于长轮询的XHR

HTML5提供的WebSocket
不可见的iframe
WebSocket通过flash
XHR长时间连接
XHR Multipart Streaming
<script>标签的长时间连接(可跨域)