before - document ready javascript

jQuery events.load(),.ready(),.unload()

Question

Solo una pregunta simple para el evento jQuery. ¿Los archivos .load (), .ready () y .unload () se ejecutan en orden cuando se carga el DOM? La respuesta parece que sí cuando veo la Documentación jQuery.

<script type="text/javascript">

    $(window).load(function () {
        // run code
        initializeCode();
    });

    $(document).ready(function() {
        //run code that MUST be after initialize
    });

    $(window).unload(function() {
        Cleanup();
    });
</script>

Sin embargo, el código dentro de .ready () se ejecuta antes del initializeCode (); se ejecuta, entonces me siento realmente extraño. Y ahora tengo que colocar mi código dentro del método .onload () y justo después del initializeCode (); línea, que significa estar dentro del bloque .ready ().

¿Podría alguien explicarme más sobre esto, ya que soy nuevo en jQuery?

Answer 1

NOTA: .load() & .unload() han quedado en deprecated

$(window).load();

Se ejecutará después de que la página junto con todos sus contenidos se hayan terminado de cargar. Esto significa que todas las imágenes, CSS (y contenido definido por CSS, como fuentes e imágenes personalizadas), scripts, etc., están cargados. Esto sucede cuando el ícono "Detener" de su navegador se convierte en gris, por así decirlo. Esto es muy útil para detectar cuándo se carga el documento junto con todos sus contenidos.

$(document).ready();

Esto, por otro lado, se activará tan pronto como el navegador web pueda ejecutar su JavaScript, lo que sucede después de que el analizador haya finalizado con el DOM. Esto es útil si desea ejecutar JavaScript lo antes posible.

$(window).unload();

Este evento se disparará cuando navegues fuera de la página. Podría ser Refresh / F5, presionar el botón de la página anterior, navegar a otro sitio web o cerrar toda la pestaña / ventana.

En resumen, ready () se disparará antes de que load () y descargue () sean los últimos en dispararse.

Answer 2

Además, noté una diferencia más entre .load y .ready. Estoy abriendo una ventana secundaria y estoy realizando algún trabajo cuando se abre la ventana secundaria. .load se llama solo la primera vez cuando abro la ventana y si no cierro la ventana, entonces no se volverá a llamar a .load. sin embargo, listo ya se ejecuta cada vez independientemente de cerrar la ventana secundaria o no.

Answer 3

Si se usan las dos variantes "document.ready", ambas se activarán, en el orden de aparición

$(function(){
    alert(''shorthand document.ready'');
});

//try changing places
$(document).ready(function(){
    alert(''document.ready'');
});

Answer 4

la carga de la ventana esperará a que se carguen todos los recursos.

el documento listo espera que el documento sea inicializado.

descargar bien, espera hasta que el documento se descargue.

el orden es: documento listo, carga de ventana, ... ... ... ... descarga de ventana.

siempre use el documento listo a menos que necesite esperar a que se carguen sus imágenes.

taquigrafía para documento listo:

$(function(){
    // yay!
});