多线程技术在服务端技术中已经发展的很成熟了，而在Web端的应用中却一直是鸡肋
在新的标准中，提供的新的WebWork API，让前端的异步工作变得异常简单。
使用：创建一个Worker对象，指向一个js文件，然后通过Worker对象往js文件发送消息，js文件内部的处理逻辑，处理完毕后，再发送消息回到当前页面，纯异步方式，不影响当前主页面渲染。
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

    <script type="text/javascript">

        //创建线程 work对象

        var work = new Worker("work.js");

        //发送消息

        work.postMessage("100");

        // 监听消息

        work.onmessage = function(event) {

            alert(event.data);

        };

    </script>

</head>

<body>

</body>

</html>

work.js

onmessage = function (event) {

    //从1加到num

    var num = event.data;

    var result = 0;

    for (var i = 1; i <= num; i++) {

        result += i;

    }

    postMessage(result);

}

HTML5学习之WebWork多线程处理（八）的更多相关文章

  1. HTML5学习笔记（十八）：闭包

    高阶函数 JavaScript的函数其实都指向某个变量.既然变量可以指向函数,函数的参数能接收变量,那么一个函数就可以接收另一个函数作为参数,也可以返回一个函数,这种函数就称之为高阶函数. 函数作为参 ...

  2. HTML5 学习总结（一）——HTML5概要与新增标签

    一.HTML5概要 1.1.为什么需要HTML5 HTML4陈旧不能满足日益发展的互联网需要,特别是移动互联网.为了增强浏览器功能Flash被广泛使用,但安全与稳定堪忧,不适合在移动端使用(耗电.触摸 ...

  3. HTML5学习总结——canvas绘制象棋(canvas绘图)

    一.HTML5学习总结——canvas绘制象棋 1.第一次:canvas绘制象棋(笨方法)示例代码: <!DOCTYPE html> <html> <head> & ...

  4. HTML5 学习笔记（一）——HTML5概要与新增标签

    目录 一.HTML5概要 1.1.为什么需要HTML5 1.2.什么是HTML5 1.3.HTML5现状及浏览器支持 1.4.HTML5特性 1.5.HTML5优点与缺点 1.5.1.优点 1.5.2 ...

  5. HTML5 学习笔记--------》HTML5概要与新增标签！

      一.HTML5概要 1.1.为什么需要HTML5 HTML4陈旧不能满足日益发展的互联网需要,特别是移动互联网.为了增强浏览器功能Flash被广泛使用,但安全与稳定堪忧,不适合在移动端使用(耗电. ...

  6. html5学习笔记一

    HTML5学习笔记 <video>标记:定义视频,Ogg.MPEG4.WebM三种格式 <video src=”movie.ogg”  controls=”controls”> ...

  7. [HTML5] 飞龙天惊-HTML5学习系列

    飞龙天惊 cnblog URL:http://www.cnblogs.com/fly_dragon/ Html5 学习系列(一)认识HTML5 http://www.cnblogs.com/fly_d ...

  8. 【Unity Shaders】学习笔记——SurfaceShader（八）生成立方图

    [Unity Shaders]学习笔记——SurfaceShader(八)生成立方图 转载请注明出处:http://www.cnblogs.com/-867259206/p/5630261.html ...

  9. HTML5学习笔记（一）：HTML简介

    Web前端涵盖的内容较多且杂,主要由3个部分组成:HTML标记语言.CSS样式语言和JavaScript脚本语言组成,而下面我们将先学习最新的标记语言HTML5. <!DOCTYPE>标记 ...

随机推荐

  1. Sqli-LABS通关笔录-3

    /*此时心情xxxx*/ 通过这一关卡我学习到了 1.大概的能够mysql回显错误注入的面目,可以根据报错,写出闭合语句. 加一个单引号.报错如下所示. 加了一个单引号就说 1'') LIMIT 0, ...

  2. ACM-括号匹配问题

    对ACM仰慕已久,无奈今天才开始.好吧,遇到的第二个题目就把我难到了.(实话是第一个) 进入正题,下面Copy出题目:  现在,有一行括号序列,请你检查这行括号是否配对. 输入 第一行输入一个数N(0 ...

  3. Win7去除桌面残影的方法

    用户升级到Win7系统后使用正常,就是系统桌面会留有残影,怎么样也去不掉,影响用户的使用,那么要如何将这些残影去掉呢?可从计算机属性中进行相关配置. 解决方法 一.在计算机面板上,右键点击“计算机”, ...

  4. echarts

    ECharts,缩写来自Enterprise Charts,商业级数据图表,一个纯Javascript的图表库,可以流畅的运行在PC和移动设备上,兼容当前绝大部分浏览器(IE6/7/8/9/10/11 ...

  5. 应用HTK搭建语音拨号系统1:数据准备

    选自:http://maotong.blog.hexun.com/6204849_d.html 应用HTK搭建语音拨号系统--数据准备 苏统华 哈尔滨工业大学人工智能研究室 2006年10月30日 声 ...

  6. 泛型约束 where T : class,new()

    假如有这样一个方法签名 public List<T> GetSomethingList<T> (int a,int b,string c) where T:class,new( ...

  7. Qt Connect 信号 槽

    信号和槽机制是 QT 的核心机制 .信号和槽是一种高级接口,应用于对象之间的通信,它是 QT 的核心特性,也是 QT 区别于其它工具包的重要地方.信号和槽是 QT 自行定义的一种通信机制,它独立于标准 ...

  8. FastReport 使用技巧篇

    使用技巧篇 1.FastReport中如果访问报表中的对象?       可以使用FindObject方法.      TfrxMemoView(frxReport1.FindObject('memo ...

  9. 2014北大研究生推免机试(校内)-复杂的整数划分(DP进阶)

    这是一道典型的整数划分题目,适合正在研究动态规划的同学练练手,但是和上一个随笔一样,我是在Coursera中评测通过的,没有找到适合的OJ有这一道题(找到的ACMer拜托告诉一声~),这道题考察得较全 ...

  10. [Android] RelativeLayout, LinearLayout,FrameLayout

    Android RelativeLayout 属性 // 相对于给定ID控件 android:layout_above 将该控件的底部置于给定ID的控件之上; android:layout_below ...