以下是一个简单的使用 HTML5 Web Workers 的例子：
1. 主线程脚本（index.html）：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Web Workers Example</title>
</head>
<body>
<h1>Web Workers Example</h1>
<script>
// 创建一个新的 Web Worker
const worker = new Worker('worker.js');
// 向 Web Worker 发送消息
worker.postMessage('Hello from the main thread!');
// 监听来自 Web Worker 的消息
worker.onmessage = function(event) {
console.log('Message from Web Worker:', event.data);
};
</script>
</body>
</html>
2. Web Worker 脚本（worker.js）：
// 监听来自主线程的消息
self.onmessage = function(event) {
console.log('Message from main thread:', event.data);
// 向主线程发送消息
self.postMessage('Hello from the Web Worker!');
};
在这个例子中，主线程创建了一个 Web Worker，然后通过 postMessage 向 Web Worker 发送消息。Web Worker 接收到消息后，在其自己的线程中执行相应的操作，并通过 postMessage 向主线程发送消息。主线程通过监听 onmessage 事件来接收来自 Web Worker 的消息。
需要注意的是，Web Worker 中不能直接操作 DOM，因为它运行在一个与主线程分离的上下文中。然而，它可以执行一些计算密集型的任务，而不会阻塞用户界面。
转载请注明出处：http://www.zyzy.cn/article/detail/12439/HTML