<!DOCTYPE html>
<html>
<body>
<!--<output> 标签定义不同类型的输出，比如脚本的输出。是 HTML 5 中的新标签-->
<p>计数: <output id="result"></output></p>
<button onclick="startWorker()">开始 Worker</button>
<button onclick="stopWorker()">停止 Worker</button>
<br /><br />
<script>
var w;
function startWorker()
{
//检测用户的浏览器是否支持它
if(typeof(Worker)!=="undefined")
{
if(typeof(w)=="undefined")
{
w=new Worker("js/worker.js");
}
//将even（事件）作为参数，就是这个“点击”事件，通过这个even，可以获取到event.target,
//onmessage在postMessage后执行
w.onmessage = function (event) {
//data属性的返回值是任意类型，返回绑定当前事件处理函数时传递的附加数据。其类型取决于在绑定当前事件处理函数时所传入的附加数据的类型。
document.getElementById("result").innerHTML=event.data;//event.data得到的是postMessage参数传递的东西
};
}
else
{
document.getElementById("result").innerHTML="Sorry, your browser does not support Web Workers...";
}
}
function stopWorker()
{
w.terminate();
}
</script>
</body>
</html>
/**
* Created by renzhenming on 2018/3/12.
*/
var i=0;
//t=setTimeout(timedCount,1000)
//1000毫秒后执行timedCount函数，而timedCount函数里面又有t=setTimeout(timedCount,1000)
//，然后就一直执行了
function timedCount()
{
i=i+1;
postMessage(i);
setTimeout("timedCount()",500);
}
timedCount();
