HTML5(Web Workers)

最新推荐文章于 2024-01-03 08:42:20 发布

weixin_34085658

最新推荐文章于 2024-01-03 08:42:20 发布

阅读量66

点赞数

原文链接：https://yq.aliyun.com/articles/657398

版权

<!DOCTYPE html>
<html>
<body>
<!--<output> 标签定义不同类型的输出，比如脚本的输出。是 HTML 5 中的新标签-->
<p>计数: <output id="result"></output></p>
<button onclick="startWorker()">开始 Worker</button>
<button onclick="stopWorker()">停止 Worker</button>
<br /><br />

<script>
    var w;

    function startWorker()
    {
        //检测用户的浏览器是否支持它
        if(typeof(Worker)!=="undefined")
        {
            if(typeof(w)=="undefined")
            {
                w=new Worker("js/worker.js");
            }
            //将even（事件）作为参数，就是这个“点击”事件，通过这个even，可以获取到event.target,
            //onmessage在postMessage后执行
            w.onmessage = function (event) {
                //data属性的返回值是任意类型，返回绑定当前事件处理函数时传递的附加数据。其类型取决于在绑定当前事件处理函数时所传入的附加数据的类型。
                document.getElementById("result").innerHTML=event.data;//event.data得到的是postMessage参数传递的东西
            };
        }
        else
        {
            document.getElementById("result").innerHTML="Sorry, your browser does not support Web Workers...";
        }
    }

    function stopWorker()
    {
        w.terminate();
    }
</script>

</body>
</html>

/**
 * Created by renzhenming on 2018/3/12.
 */
var i=0;
//t=setTimeout(timedCount,1000)
//1000毫秒后执行timedCount函数，而timedCount函数里面又有t=setTimeout(timedCount,1000)
//，然后就一直执行了
function timedCount()
{
    i=i+1;
    postMessage(i);
    setTimeout("timedCount()",500);
}

timedCount();

weixin_34085658

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML5(Web Workers)

<!DOCTYPE html><html><body><p>计数: <output id="result"></...
复制链接

扫一扫