html5中的web worker用法

html5 web worker相当于在主线程下有开了一个子线程，可以在后台运行子线程而不影响页面相应。

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

{

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

{

var w=new Worker("demo_test.js");

work.onmessage=function(event)d

{

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

}

else

{

document.getElementById("hint").innerHTML="web worker is not supported by this browser!";

}

web worker的常用api

postMessage()用于主线程与子线程的相互通信。

主线程传递给子线程:w.postMessage();

子线程传递给主线程：postMessage();

onmessage():主线程与子线程用于监听消息；

主线程监听来之子线程的消息：w.onmessage=function(event){event.data}

子线程监听来之主线程的消息: onmessage=function(event){}

onerror()用于监听错误

w.οnerrοr=function(e)

{

e.message:错误消息

e.lineno：错误所在的行号

e.filename:错误的文件名

}

一般来说Javascript和页面的UI会共用一个线程，所以当点击一个按钮开始运行Javascript后，在这段代码运行完毕之前，页面是无法响应用户操作的，换句话来说就是被“冻结”了。而这段代码可以交给Web Worker在后台运行，那么页面在Javascript运行期间依然可以响应用户操作。后台会启动一个worker线程来执行这段代码，用户可以创建多个worker线程。所以你可以在前台做一些小规模分布式计算之类的工作，不过Web Worker有以下一些使用限制：

Web Worker无法访问DOM节点；
Web Worker无法访问全局变量或是全局函数；
Web Worker无法调用alert()或者confirm之类的函数；
Web Worker无法访问window、document之类的浏览器全局变量；

不过Web Worker中的Javascript依然可以使用setTimeout(),setInterval()之类的函数，也可以使用XMLHttpRequest对象来做Ajax通信。

html5中的web worker用法相关推荐

php中的ol标签,html5中ol标签的用法详解
这篇文章主要介绍了详解HTML5中ol标签的用法,是HTML5入门学习中的基础知识,需要的朋友可以参考下定义和用法标签定义有序列表. HTML 4.01 与 HTML 5 之间的差异在 HTML ...
HTML5中的Web Notification桌面通知(右下角提示)
html5桌面通知(Web Notifications)对于需要实现在新消息入线时,有桌面通知效果的情况下非常有用,在此简单介绍一下这个html5的新属性.通过Web Notifications(桌面 ...
html5中ol的意思,详解HTML5中ol标签的用法
定义和用法标签定义有序列表. HTML 4.01 与 HTML 5 之间的差异在 HTML 4.01 中,不赞成使用 "start" 属性,在 HTML 5 中是允许的. 在 ...
【HTML】HTML5中的Web Notification桌面通知
大家在做一些浏览器端的聊天功能的时候,或者在一些网站跟在线客服咨询的时候,会看到一些消息通知的提示,常见的有浏览器标签页的闪烁和屏幕右侧的消息通知.这里简单的介绍一下如何实现这样的功能. 1.实现标签 ...
html的canvas标签用法,html5中关于canvas标签用法（绘图）
标签只是图形容器,您必须使用脚本来绘制图形. 用canvas配合javascript可以直接在html页面动态绘图,无需调用jquery. 代码如下: var my_canvas=document.g ...
关于Web Worker你必须知道的7件事
原文:http://www.developer.com/lang/jscript/7-things-you-need-to-know-about-web-workers.html 译者: Rock(r ...
如何查找历史线程阻塞原因_学习 Web Worker（js中的“多线程”）
昨天部门例会,讨论开发的系统遇到的问题,遇到一个医保上传比较耗时的问题,解决方案提到了Web Worker,学习一波. 首先简单介绍一下什么是web worker.我们都知道在浏览器中javascri ...
html5之web worker
Web Worker 在本文中与 Web Worker 进行双向通信 WindowTimers 在 IE10 Platform Preview 4 中对 Web Worker 的更新 API 参考 ...
弥补Web开发缺陷实战 HTML5 中存储API
COOKIES的限制和缺陷首先,让我们来回顾下 cookies.Cookies 的出现可谓大大推动了Web的发展,但它既有优点也有一定的缺陷.Cookies 的优点在于,它可以允许我们在登陆网站时, ...
什么是Web Worker？
简单点说,Web Worker就是一个运行在后台的JavaScript线程,不会影响页面的响应. 我们知道,JavaScript是单线程的脚本语言,即同一时刻只能做一件事情,否则会带来极其复杂的同步问 ...

html5中的web worker用法

html5中的web worker用法相关推荐

最新文章

热门文章