html5 worker 实例(一) 为什么测试不到效果

2016-02-19 10:36 19 1 收藏

在这个颜值当道,屌丝闪边的时代,拼不过颜值拼内涵,只有知识丰富才能提升一个人的内在气质和修养,所谓人丑就要多学习,今天图老师给大家分享html5 worker 实例(一) 为什么测试不到效果,希望可以对大家能有小小的帮助。

【 tulaoshi.com - Web开发 】

很多人在测试worker api的时候,总是会出现异常,根本测试不到效果。
在使用worker的时候有个必须注意的地方,就是单纯的文本文件是实现不了worker的,你写的实际代码 必须部署到服务器(tomcat.jBoss等)才能运行worker api。
下面写个简单例子

js代码test.js(worker)

代码如下:

function messageHandler(e) {
postMessage("worker says: " + e.data + " too");
}
addEventListener("message", messageHandler, true);
postMessage("2222222222");

html代码 index.html

代码如下:

!DOCTYPE html
html
head
titleindex.html/title
meta http-equiv="keywords" content="keyword1,keyword2,keyword3"
meta http-equiv="description" content="this is my page"
meta http-equiv="content-type" content="text/html; charset=UTF-8"
!--link rel="stylesheet" type="text/css" href="./styles.css"--
/head
body
script type="text/javascript"
if(typeof(Worker)!=="undefined"){
console.log("zhichi worke");
}else{
console.log("no support!");
}
function messageHandler(e){
console.log(e.data);
}
function errorHandler(e){
console.log(e.message, e);
}
var myWorker = new Worker("task.js");
myWorker.addEventListener("message", messageHandler, true);
myWorker.addEventListener("error", errorHandler, true);
myWorker.postMessage("1 fangsong d");
/script
/body
/html

不是之后直接访问index.html页面,然后在浏览器的console面板中将看到worker发送的字符串(实际应用中一般使用json传送)。

来源:http://www.tulaoshi.com/n/20160219/1595189.html

延伸阅读
标签: Web开发
canvas是一个新的HTML元素,这个元素可以被Script语言(通常是JavaScript)用来绘制图形。例如可以用它来画图、合成图象、或做简单的(和不那么简单的)动画。右面的图象展示了一些canvas的应用示例,我们将会在此教程中看到他们的实现。 canvas最先在苹果公司(Apple)的Mac OS X Dashboard上被引入,而后被应用于Safari。基于Gecko1.8的浏览器,...
标签: Web开发
原文: http://www.lifelaf.com/blog/?p=371 本文翻译自Steve Fulton & Jeff Fulton HTML5 Canvas, Chapter 2, Using Paths to Create Lines 对于HTML5 Canvas,我们可以使用路径来描画任何图形。路径,简单来说就是一系列的点以及连接这些点的线。任何Canvas上下文只会有一个当前路径,而当context.save()调用时,该当前路径并不会被...
标签: Web开发
HTML5之前,要实现网页元素的拖放操作,需要依靠mousedown、mousemove、mouseup等API,通过大量的JS代码来实现;HTML5中引入了直接支持拖放操作的API,大大简化了网页元素的拖放操作编程难度,并且这些API除了支持浏览器内部元素的拖放外,同时支持浏览器和其它应用程序之间的数据互相拖动。 本文通过一个简单示例,演示HTML5中拖放API的使用...
标签: Web开发
今天,大多数视频是通过插件(比如 Flash)来显示的。然而,并非所有浏览器都拥有同样的插件。 HTML5 规定了一种通过 video 元素来包含视频的标准方法。 在HTML5中,video元素目前支持三种格式的视频文件, 1.Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件 2.MPEG4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件 3.Web...
标签: Web开发
演示地址 http://koking.8u.hanmandarin.com/html5/1.html 简单介绍 小球可以在方框内部自由运动 可以通过方向键控制黑色砖块上下左右移动去与小球发生碰撞 代码实现 代码如下: !-- To change this template, choose Tools | Templates and open the template in the editor. -- !DOCTYPE html html head title乒...

经验教程

119

收藏

75
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部