检测浏览器是否支持WebWorker

 

    在创建webworker之前，请检测用户的浏览器是否支持它：

 

if(typeof(Worker)!=="undefined")

{

    // 是的! Web worker 支持!

    // 一些代码.....

}

else

{

    //抱歉! Web Worker 不支持

}

 

 

    创建webworker文件

 

    现在，让我们在一个外部JavaScript中创建我们的webworker。

 

    在这里，我们创建了计数脚本。该脚本存储于"demo_workers.js"文件中：

 

var i=0;

 

function timedCount()

{

    i=i+1;

    postMessage(i);

    setTimeout("timedCount()",500);

}

 

timedCount();

 

 

    以上代码中重要的部分是postMessage()方法-它用于向HTML页面传回一段消息。

 

    注意:webworker通常不用于如此简单的脚本，而是用于更耗费CPU资源的任务。

 

    创建WebWorker对象

 

    我们已经有了webworker文件，现在我们需要从HTML页面调用它。

 

    下面的代码检测是否存在worker，如果不存在，-它会创建一个新的webworker对象，然后运行"demo_workers.js"中的代码：

 

if(typeof(w)=="undefined")

{

    w=new Worker("demo_workers.js");

}

 

 

    然后我们就可以从webworker发生和接收消息了。

 

    向webworker添加一个"onmessage"事件监听器：

 

w.onmessage=function(event){

    document.getElementById("result").innerHTML=event.data;

};

 

 

    终止WebWorker

 

    当我们创建webworker对象后，它会继续监听消息（即使在外部脚本完成之后）直到其被终止为止。

 

    如需终止webworker，并释放浏览器/计算机资源，请使用terminate()方法：

 

    w.terminate();

 

    WebWorkers和DOM

 

    由于webworker位于外部文件中，它们无法访问下列JavaScript对象：

 

    window对象

 

    document对象

 

    parent对象