window.onload vs document.ready jQuery

Question

Ho un sito con due colonne. Voglio avere uguale altezza su entrambi usando jQuery.

Sto cercando di ottenere l'altezza della colonna del logo. Ho avuto:

$(document).ready(function() { 
    alert($('#logo').height()); 
});​ 

e non ha funzionato. Quindi l'ho modificato in:

window.onload = function(){ 
    alert($('#logo').height()); 
} 

E funziona. Cosa sta succedendo qui?

Answer 1

document ready viene generato quando il DOM è stato caricato, quindi le informazioni come l'altezza non sono disponibili, a meno che non siano dichiarate esplicitamente.

window onload attende che le risorse nella pagina siano completamente caricate, quindi ora sono disponibili informazioni come l'altezza.

Answer 2

ho avuto un problema nella gestione stessa altezza e la larghezza interna $ (document) pronto e ho trovato alcune referenses meglio per risolverlo ... Spero che questo possa aiutare alcuni uno

$ (document). ready()

L'evento pronto per il documento viene attivato quando il documento HTML viene caricato e il DOM è pronto, anche se tutti i grafici non sono ancora stati caricati. Se vuoi collegare i tuoi eventi per determinati elementi prima che la finestra venga caricata, $ (document) .ready è il posto giusto.

Codice:

$(document).ready(function() { 
    // document is loaded and DOM is ready 
    alert("document is ready"); 
}); 

$ .load (finestra)()

L'evento carico finestra ha sparato un po 'più tardi, quando la pagina completa è a pieno carico, compresi tutti i fotogrammi, oggetti e immagini. Pertanto le funzioni che riguardano le immagini o altri contenuti della pagina devono essere collocate nell'evento load per la finestra o il tag di contenuto stesso.

Codice:

$(window).load(function() { 
    // page is fully loaded, including all frames, objects and images 
    alert("window is loaded"); 
});