Trabajadores Web HTML5
trabajador web ejecuta JavaScript en segundo plano y no afecta el rendimiento de la página.
¿Qué es un Trabajador Web?
Al ejecutar una secuencia de comandos en una página HTML, el estado de la página no responde hasta que el script se ha completado.
trabajador web JavaScript ejecuta en segundo plano, independiente de otras secuencias de comandos no afectarán el funcionamiento de la página. Puede continuar a hacer lo que está dispuesto a hacer: Haga clic para seleccionar el contenido, etc., en un momento en trabajador web se ejecuta en segundo plano.
Soporte para el navegador
Internet Explorer 10, Firefox, Chrome, Safari y Opera trabajadores web de asistencia.
ejemplos de los trabajadores Web HTML5
El siguiente ejemplo crea un simple trabajador web, contando en segundo plano:
código del archivo demo_workers.js:
función timedCount ()
{
i = i + 1;
postMessage (i);
setTimeout ( "timedCount ()", 500);
}
timedCount ();
Detectar si el navegador es compatible con la Web Worker
Antes de crear un trabajador web, por favor compruebe el navegador del usuario soporta:
{
// Sí! Apoyo de los trabajadores Web!
//Parte del código .....
}
otro
{
Trabajador Web // Lo sentimos! No se admite
}
Crear un archivo trabajador web
Ahora, vamos a crear nuestra web trabajador en un JavaScript externo.
Aquí, hemos creado un recuento de la escritura. La secuencia de comandos se guarda en el archivo "demo_workers.js":
función timedCount ()
{
i = i + 1;
postMessage (i);
setTimeout ( "timedCount ()", 500);
}
timedCount ();
parte importante del código anterior es el método postMessage () - se utiliza para devolver alguna página HTML noticias.
Nota: Trabajador de banda generalmente no se utiliza para este tipo de scripts simples, pero para tareas más intensivas de la CPU.
Crear un objeto Web Worker
Ya tenemos un archivo trabajador web, y ahora tenemos que llamarlo desde una página HTML.
El siguiente código detecta la presencia del trabajador, si no hay - se crea un nuevo objeto trabajador web y luego ejecutar "demo_workers.js" código:
{
w=new Worker("demo_workers.js");
}
entonces podemos tener lugar y recibir mensajes desde el trabajador web.
Añadir al trabajador de un "web" onMessage detectores de eventos:
. Document.getElementById ( "número") innerHTML = event.data;
};
terminación Web Worker
Cuando creamos un objeto trabajador web, que continuará para escuchar mensajes (incluso después de la finalización de un script externo) hasta que se termina.
Para poner fin a un trabajador web, y liberar los recursos del navegador / equipo, utilice el método de terminar ():
código de ejemplo Web Worker completa
Hemos visto Js código Trabajador archivo. Aquí está la página HTML:
Ejemplos
<Html>
<Head>
<Charset Meta = "UTF-8">
<Title> Este tutorial (w3big.com) </ title>
</ Head>
<Cuerpo>
<P> cuenta: <salida id = "número"> </ salida> </ p>
<Botón onclick = "startWorker ()"> trabajar </ botón>
<Botón onclick = "stopWorker ()"> detuvo </ botón>
<P> <strong> Nota: </ strong> Internet Explorer 9 y versiones anteriores del navegador Internet Explorer no apoyar a los trabajadores de la web </ p>.
<Script>
w var;
funcionar startWorker () {
si (typeof (Trabajador)! == "indefinido") {
si (typeof (w) == "indefinido") {
w = new Trabajador ( "demo_workers.js");
}
w.onmessage = function (event) {
. Document.getElementById ( "número") innerHTML = event.data;
};
} Else {
document.getElementById ( "número") innerHTML = "Lo sentimos, su navegador no soporta Web Workers ..." .;
}
}
función stopWorker ()
{
w.terminate ();
w = indefinido;
}
</ Script>
</ Body>
</ Html>
Trate »
Trabajadores web y el DOM
Como el trabajador web en un archivo externo, no pueden acceder al objeto JavaScript el siguiente ejemplo:
- objeto de la ventana
- objetos de documento
- objetos padre