JS——worker 客官°小女子只卖身不卖艺 2022-06-03 07:39 133阅读 0赞 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <button>按钮1</button> <script src="js/prime.js"></script> <button>按钮2</button> </body> </html> function isPrime(num){ var start=new Date().getTime(); do{ var end=new Date().getTime(); }while(end-start<3000); for(var i=2;i<num;i++){ if(num%i==0){ break; } } if(i==num){ return true; } else{ return false; } } isPrime(10000); 上面代码可以看到3秒多的延时，按钮2后面才显示出来。 \-------------------------------------------------------------------------- <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <button>按钮1</button> <script> new Worker("js/prime.js"); </script> <button>按钮2</button> </body> </html> function isPrime(num){ var start=new Date().getTime(); do{ var end=new Date().getTime(); }while(end-start<3000); for(var i=2;i<num;i++){ if(num%i==0){ break; } } if(i==num){ return true; } else{ return false; } } isPrime(10000); 上面的代码可以先将按钮都显示出来，然后后台执行worker。 \------------------------------------------------------------------------------- <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <button>按钮1</button> <div id="msg"></div> <script> var w=new Worker("js/prime1.js"); w.onmessage=function(e){ var msg=document.getElementById('msg'); msg.innerHTML=e.data; } </script> <button>按钮2</button> </body> </html> function isPrime(num){ var start=new Date().getTime(); do{ var end=new Date().getTime(); }while(end-start<3000); for(var i=2;i<num;i++){ if(num%i==0){ break; } } if(i==num){ return true; } else{ return false; } } isPrime(10000); postMessage('ha'); 上面代码带一些数据输入输出。（Worker->UI） \-------------------------------------------------------------- <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <input type="number" id="input"> <button id="btn_qr">开始计算累加和</button> <div id="result"> </div> <script> //UI->worker function getId(id){ return document.getElementById(id); } btn_qr.οnclick=function(){ var val=getId('input').value; var w=new Worker("js/comp.js");//worker w.postMessage(val); } </script> </body> </html> onmessage=function(e){ var val=parseInt(e.data); console.log(getSum(val)); } function getSum(num){ var sum=0; for(var i=1;i<=num;i++){ sum+=i; } return sum; } 上面代码带一些数据输入输出。（UI->Worker） \-------------------------------------------------------------- 注：js中有DOM/BOM不能使用Woker。
还没有评论，来说两句吧...