HTML5中得缓存机制，前端开发规范文档

function startWorker()

{

if(typeof(Worker)!==“undefined”)

{

if(typeof(w)==“undefined”)

{

w=new Worker(“demo_workers.js”);

}

w.onmessage = function (event) {

document.getElementById(“result”).innerHTML=event.data;

};

}

else

{

document.getElementById(“result”).innerHTML=“Sorry, your browser does not support Web Workers…”;

}

}

function stopWorker()

{

w.terminate();

}

创建的计数脚本，该脚本存储于 “demo_workers.js” 文件中

var i=0;

function timedCount()

{

i=i+1;

postMessage(i);

setTimeout(“timedCount()”,500);

}

timedCount();

2.Web Storage

---

使用HTML5可以在本地存储用户的浏览数据。早些时候，本地存储使用的时cookie。但是Web存储需要更加安全与快速，这些数据不会被报错在服务器上，但是这些数据只用于用户请求网站数据上。它也可以存储大量的数据，而不影响网站的性能。数据以键/值对存在，web网页的数据只运行该网页访问使用。

客户端存储数据的两个对象为：

• localStorage–没有时间限制的数据存储

• sessionStorage–针对一个session的数据存储，当用户关闭浏览器后，数据会被删除。

注意：在使用web存储前，应该检查浏览器是否支持localStorage和sesscionStorage

如以下代码判断：

if(typeod(Storage)!==“undefined”){

//表示支持，

//一些代码…

}else{

//抱歉，不支持

}

不管是localStorage还是sessionStorage，可使用的API都相同，常用的有如下几个（以localStorage为例）

• 保存数据：localStorage.setItem(key,value)

• 读取数据：localStorage.getItem(key,value)

• 删除数据：localStorage.removeItem(key);

• 删除所有的数据：localStorage.clear();

• 得到某个索引的key：localStorage.key(index);

3.WebSocket

---

WebSocket时HTML5开始提供的一种单个TCP连接上进行全双面工通的协议。在WebSocket API中，浏览器和服务器只需要做一个握手工作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间可以数据互相传送。浏览器通过JavaScript向服务器发出建立WebSocket连接后，你可以通过send()方法向服务器发送数据，并通过onmessage时间来接收服务器返回的数据