¿Sobreescribe la página de escritura de JavaScript?

Soy muy nuevo con javascript.¿Sobreescribe la página de escritura de JavaScript?

Estoy tratando de crear una etiqueta utilizando document.write (con Wordpress) para agregar un estilo que oculta las imágenes antes de que se precarguen. Tuve que recurrir a escribir un estilo Javascript para ocultar las imágenes antes de que se carguen a través de CSS. No quiero escribirlo realmente en el archivo CSS en caso de que el usuario tenga Javascript desactivado y las imágenes nunca se muestren.

Estoy tratando de obtener este código para trabajar:

jQuery(function($) { 
    document.write('<style type="text/css"> .preload img { display: none; } </style>'); 
    $('#body-wrap').preloadThis(); 
});

embargo, sólo es sobrescribir toda la página y hacer que se queda en blanco. ¿Cómo puedo detener esto? Quiero agregar la etiqueta a la sin quitar la página. Intenté usar 'devolver', sin suerte.

Lo siento, soy un novato. Gracias por adelantado.

Fuente

2010-12-23 Matthew Ruddy

Usando document.write() después de que la página ha terminado de cargar implicitly calls document.open(), que crea una página nueva. Usted debe evitar generalmente document.write() y se adhieren a las técnicas adecuadas de creación de DOM, o utilizar métodos de creación de la taquigrafía de jQuery:

jQuery(function($) { 
    $('<style type="text/css"> .preload img { display: none; } </style>') 
     .appendTo("head"); 
    $('#body-wrap').preloadThis(); 
});

Estoy asumiendo que no se puede editar los archivos HTML o CSS que se cargan por la página a incluir esta regla? Si ese es el caso, y desea que estos estilos aplicados antes de que la página termine de cargarse, tomar document.write() fuera del manejador listo jQuery:

// write() before the document finishes loading 
document.write('<style type="text/css"> .preload img { display: none; } </style>'); 
jQuery(function($) { 
    $('#body-wrap').preloadThis(); 
});

Esto escribirá la etiqueta <style> inmediatamente después de la etiqueta <script> se está ejecutando actualmente. Afortunadamente, esto está en su elemento <head> ya que <style> no es válido en ningún otro lado, aunque todos los navegadores deberían analizarlo de cualquier manera.

Fuente

2010-12-23 16:12:44

El mismo problema que con .hide() .. cuando las imágenes se almacenan en caché (cargadas en la carga de la página anterior) son visibles antes de que se aplique jQuery. Esto hace que la imagen aparezca antes de ocultarse, luego se desvanece por el plugin de precarga. Intenta deshacerte del parpadeo antes de que se oculte. –

@Matthew: He actualizado mi respuesta. Es seguro usar 'document.write' si la página no ha terminado de cargarse, por lo que si lo saca del manejador de documentos listos para jQuery, debería estar bien. –

No es necesario añadir <style> etiqueta, sólo les puede ocultar con jQuery:

jQuery(function($) { 
    $('.preload img').hide(); 
    $('#body-wrap').preloadThis(); 
});

No sabe cómo funciona su función preloadThis(), pero supongo que carga las imágenes y elimina .preload clase de img contenedor. Si funciona así, este código no te ayudará: las imágenes permanecerán ocultas.

Fuente

2010-12-23 16:13:40

No encuentra todas las imágenes dentro de .preload y las desvanece. El problema con .hide() es que no se inicia lo suficientemente rápido cuando las imágenes se almacenan en caché, por lo que las imágenes son visibles por una fracción de segundo antes de que se oculten , luego se desvanecieron. No se ve bien. –

¿Sobreescribe la página de escritura de JavaScript?

Respuesta

Cuestiones relacionadas