HTML5 ? ???
?????
HTML ????? ????? ??? ? ????? ??? ??? ??? ??? ???? ????.
? ??? ?? ????? ????? ??????? ???? JavaScript?? ??? ??? ??? ??? ????. ? ???? ??????? ???? ?? ??, ?? ? ??? ??? ??? ? ????.
???? ??
Internet Explorer 10, Firefox, Chrome, Safari ? Opera? ?? ? ???? ?????.
HTML5 Web Workers ????
?? ???? ??????? ???? ??? ? ???? ????.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>php中文網(wǎng)(php.cn)</title>
</head>
<body>
<p>計(jì)數(shù)： <output id="result"></output></p>
<button onclick="startWorker()">開(kāi)始工作</button>
<button onclick="stopWorker()">停止工作</button>
<p><strong>注意：</strong> Internet Explorer 9 及更早 IE 版本瀏覽器不支持 Web Workers.</p>
<script>
var w;
function startWorker() {
if(typeof(Worker) !== "undefined") {
if(typeof(w) == "undefined") {
w = new Worker("demo_workers.js");
}
w.onmessage = function(event) {
document.getElementById("result").innerHTML = event.data;
};
} else {
document.getElementById("result").innerHTML = "抱歉，你的瀏覽器不支持 Web Workers...";
}
}
function stopWorker()
{
w.terminate();
w = undefined;
}
</script>
</body>
</html>????? ???? ??? ???
demo_workers.js ?? ??:
var i=0;
function timedCount()
{
i=i+1;
postMessage(i);
setTimeout(" timedCount ()",500);
}
timedCount();
????? Web Worker? ????? ??
? ???? ??? ?? ???? ????? ?? ????? ?????.
if(typeof(Worker)!= = "???? ??")
{
// ? ??? ??!
// ?? ??....
}
else
{
// ???? ?? ? Worker..
}
? ??? ?? ???
?? ?? ??? ???. ?? JavaScript? ???.
??? ?? ????? ?????. ????? "demo_workers.js" ??? ?????:
var i=0;
function timedCount()
{
i=i+1;
postMessage(i);
setTimeout("timedCount()",500);
}
timedCount();? ???? ??? ??? postMessage() ??????. ? ???? ???? HTML ???? ?? ??? ? ?????.
??: ? ???? ????? ??? ??? ????? ???? ?? CPU ???? ??? ?????.
? ??? ?? ???
?? ? ??? ??? ???? ?? HTML ????? ???? ???. /p>
?? ??? ???? ????? ??? ????, ???? ?? ?? ? ? ??? ??? ??? ?? "demo_workers.js"?? ??? ?????: /p>
if(typeof(w)=="???? ??")
{
w=new Worker("demo_workers.js");
}
??? Web Worker? ???? ???? ? ????.
? ???? "onmessage" ??? ??? ??:
w.onmessage=function(event){
document.getElementById("result") .innerHTML=event.data;
};
<p web="" Worker=""? ???? ???? ??? ???? ??? ?????. event.data=""?? ="" event.data=""? ???? ???? ????.
Web Worker ??
? ??? ??? ??? ??? (?? ????? ??? ???) ???? ???? ?????.
? ???? ???? ????/??? ???? ????? quit() ???? ??????:
w.terminate();
?? Web Worker ?? ??
.js ???? Worker ??? ??????. HTML ???? ??? ??? ????.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>php中文網(wǎng)(php.cn)</title>
</head>
<body>
<p>計(jì)數(shù)： <output id="result"></output></p>
<button onclick="startWorker()">開(kāi)始工作</button>
<button onclick="stopWorker()">停止工作</button>
<p><strong>注意：</strong> Internet Explorer 9 及更早 IE 版本瀏覽器不支持 Web Workers.</p>
<script>
var w;
function startWorker() {
if(typeof(Worker) !== "undefined") {
if(typeof(w) == "undefined") {
w = new Worker("demo_workers.js");
}
w.onmessage = function(event) {
document.getElementById("result").innerHTML = event.data;
};
} else {
document.getElementById("result").innerHTML = "抱歉，你的瀏覽器不支持 Web Workers...";
}
}
function stopWorker()
{
w.terminate();
w = undefined;
}
</script>
</body>
</html>? ??? ? DOM
? ???? ?? ??? ???? , ???? ? ????. ?? JavaScript ??:
? ??
?? ??
?? ??
