dónde es el mejor lugar para colocar un fragmento de JavaScript para modificar el DOM de una página antes de que se muestre

Tengo algunas páginas dinámicas y deseo modificar ciertos elementos antes de que la página se haya procesado por completo.dónde es el mejor lugar para colocar un fragmento de JavaScript para modificar el DOM de una página antes de que se muestre

Mi fragmento es algo así como

document.body.getElementById("change").innerHTML = "<img src...";

no tengo acceso para cambiar el lado del servidor de contenido.

¿Dónde está el mejor lugar para poner el fragmento de tener el código ejecutar antes de que la página se ha rendido?

Más bien, está poniendo el javascript ya sea en la cabeza (dentro del evento window.onload?) O antes que el cuerpo de cierre (no dentro de un detector de eventos) óptima?

Fuente

2010-04-28 markmarkoh

AFAIK no puede hacer esto. Porque antes de que se represente una página, no habrá ningún elemento y no podrá acceder a elementos que no se hayan cargado en el árbol DOM.

Fuente

2010-04-28 10:06:06 rahul

Me temo que es muy poco probable que pueda ejecutar su script antes de que se visualice la página. Claro que puede colocar un script en línea y hacer que use document.write (...) en el lugar donde le gustaría que muestre su contenido, pero esta es una solución horrible. De lo contrario, lo mejor que puede hacer es en el evento 'DOM Ready', aunque es difícil de hacer en todos los navegadores de manera consistente, realmente necesita una biblioteca para abstraer los detalles. jQuery proporciona su método listo para disparar un evento cuando el DOM está listo, en lugar de cuando la página y todos los recursos están terminados de cargarse.

Fuente

2010-04-28 10:08:14 Geoff

Desde el navegador por lo general representa los elementos inmediatamente después de que se hayan analizado la mejor manera sería hacer lugar el código en un elemento script directamente después de que el elemento de referencia:

<div id="change"></div> 
<script type="text/javascript"> 
    document.body.getElementById("change").innerHTML = "<img src..."; 
</script>

Fuente

2010-04-28 10:14:29 RoToRa

No estoy seguro de entender el problema correctamente, pero si usa un detector de eventos dentro del encabezado (como jQuery's $(document).ready()), podrá modificar el elemento una vez que se haya cargado la estructura dom pasándole el fragmento a la función (handler) a la que se llama cuando se desate el evento.

<HEAD> 
    //... 
    <SCRIPT type="text/javascript"> 

     $(document).ready(function() { 
      $("#change").append(
       $("<img src=\"...\">") 
      ) ; 
     }) ; 

    <SCRIPT> 

</HEAD>

El uso de JavaScript que tendrá que desembolsar sus detectores de eventos para Mozilla (W3C) y las especificaciones de eventos de Internet Explorer. Hay mucha documentación sobre cómo hacer eso en internet.

De cualquier manera lo mejor que puede hacer en este caso, obviamente, sería crear el contenido usted mismo, no alterarlo post-procesamiento.

Fuente

2010-04-28 11:29:03 FK82

Si no desea representar ningún elemento antes de realizar los cambios DOM, puede establecer CSS display: none en el elemento body y luego cambiarlo a display: block una vez que haya terminado.

Fuente

2017-05-15 08:05:52

dónde es el mejor lugar para colocar un fragmento de JavaScript para modificar el DOM de una página antes de que se muestre

Respuesta

Cuestiones relacionadas