首页 > web前端 > H5教程 > 正文

HTML5-Web Worker APIs的代码详解

黄舟
发布: 2017-04-01 11:28:24
原创
1922人浏览过

1.概述
  html5 web worker可以使javascript程序在后台单线程执行大量耗时的计算任务。web worker在执行时不能直接访问dom。web worker也会消耗cpu和系统资源。web worker与页面间的通信可以通过web worker的方法postmessage和message事件

2.浏览器支持检测

 function loadDemo() 
   { 
      
if
 (typeof(Worker) !== "undefined") 
      { 
         
document
.getElementById("support").innerHTML =  
            "Excellent! Your browser supports HTML5 Web Workers"; 
      } 
   }
登录后复制

3.worker对象
  worker对象是window对象的子对象,它有下面几个方法:
  •Worker(jsFile_URL):构造函数,参数是一个用于执行Web Worker任务的JavaScript文件的URL地址,可以是相对或绝对地址。可以递归建立worker。在页面调用。
  •terminate():终止worker,终止后不能再重用,只能重建。
在页面调用。
  •close():终止worker,在Worker内调用。
  •importScripts(jsFile_1_URL, jsFile_2_URL, ... ):异步地向一个已存在的worker导入JavaScript文件,JavaScript的按照参数的顺序执行。在Worker脚本内部调用。
  •postMessage(msg):创建werker的页面与worker之间通信的方法,例如:

    // -------------由页面向worker
发送消息
------------------
      document.getElementById("helloButton").
onclick
 = function() { 
         worker.postMessage("Here's a message 
for
 you"); 
      }
      // -------------页面接收来自worker的消息----------------      
      worker.addEvent
List
ener("message", messageHan
dl
er, true); 
      function messageHandler(e) { 
         // process message from worker 
      } 
      // -------------JavaScript
文件处理
来自页面的消息----------------
      addEventListener("message", messageHandler, true);
      function messageHandler(e) { 
         postMessage("worker says: " + e.data + " too"); 
      }
登录后复制

4.错误处理

代码小浣熊
代码小浣熊

代码小浣熊是基于商汤大语言模型的软件智能研发助手,覆盖软件需求分析、架构设计、代码编写、软件测试等环节

代码小浣熊 51
查看详情 代码小浣熊
 // -------------在页面处理来自worker的消息----------------
   worker.addEventListener("error", errorHandler, true);
   function errorHandler(e) { 
      console.log(e.message, e); 
   }
登录后复制

5.使用定时器
  尽管worker不能直接访问DOM中的对象,但可以完全使用window对象中与时间有关的方法和属性,也可以使用部分其他属性。如:

立即学习前端免费学习笔记(深入)”;

  var t = 
set
Time
out(postMessage, 2000, "delayed message");
登录后复制

以上就是HTML5-Web Worker APIs的代码详解的详细内容,更多请关注php中文网其它相关文章!

相关标签:
HTML速学教程(入门课程)
HTML速学教程(入门课程)

HTML怎么学习?HTML怎么入门?HTML在哪学?HTML怎么学才快?不用担心,这里为大家提供了HTML速学教程(入门课程),有需要的小伙伴保存下载就能学习啦!

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号