Risposte:
document.readyè un evento jQuery, viene eseguito quando il DOM è pronto, ad esempio tutti gli elementi sono lì per essere trovati / utilizzati, ma non necessariamente tutto il contenuto .window.onloadsi attiva in seguito (o allo stesso tempo nei casi peggiori / non riusciti) quando vengono caricate immagini e simili, quindi se si utilizzano dimensioni dell'immagine, ad esempio, spesso si desidera utilizzarlo invece.$(window).on('load'). Entrambi fanno riferimento all'evento load .
it will run on ALL future calls of the function?
$(document).readycodice dopo che il DOM è pronto. È un caso d'uso così piccolo che probabilmente non valeva la pena confondere tutti con menzionarlo. 2) L'AMBIENTE chiama solo $(document).ready(function(){})una volta, quando il DOM è pronto. Se l'utente, per qualche motivo, esegue di più $(document).readydopo che il DOM è pronto, allora sì, verrà eseguito immediatamente.
$(document).ready(function() {
// executes when HTML-Document is loaded and DOM is ready
alert("document is ready");
});
$(window).load(function() {
// executes when complete page is fully loaded, including all frames, objects and images
alert("window is loaded");
});Il $(window).load()non è disponibile in jQuery 3.0
$( window ).load(function() {
// Handler for .load() called.
});Per aggirare il problema, puoi usarlo come "Allegato gestore eventi"
$( window ).on("load", function() {
// Handler for .load() called.
});Le differenze sono:
$(document).ready(function() { è l'evento jQuery che viene generato quando viene caricato DOM, quindi viene generato quando la struttura del documento è pronta.
$(window).load() l'evento viene generato dopo il caricamento dell'intero contenuto.
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$( document ).ready(function() {
alert( "document loaded" );
});
$( window ).load(function() {
alert( "window loaded" );
});
</script>
</head>
<body>
<iframe src="http://stackoverflow.com"></iframe>
</body>
</html>window.load verrà attivato dopo aver caricato tutto il contenuto iframe
$(document).ready accade quando tutti gli elementi sono presenti nel DOM, ma non necessariamente tutto il contenuto.
$(document).ready(function() {
alert("document is ready");
});window.onloado $(window).load()succede dopo che tutte le risorse di contenuto (immagini, ecc.) sono state caricate.
$(window).load(function() {
alert("window is loaded");
});Da jquery prospective - sta semplicemente aggiungendo load/ onloadevent alla finestra e al documento. Controllalo:
document.ready (jQuery) document.ready verrà eseguito subito dopo che il documento HTML è stato caricato e il DOM è pronto.
DOM: Document Object Model (DOM) è una convenzione multipiattaforma e indipendente dal linguaggio per la rappresentazione e l'interazione con oggetti in documenti HTML, XHTML e XML.
$(document).ready(function()
{
// executes when HTML-Document is loaded and DOM is ready
alert("(document).ready was called - document is ready!");
});window.load (JavaScript incorporato) window.load tuttavia attenderà il completo caricamento della pagina, inclusi frame interni, immagini ecc. * window.load è un metodo JavaScript incorporato, è noto per avere alcuni stranezze nei vecchi browser (IE6, IE8, vecchie versioni di FF e Opera) ma generalmente funzioneranno in tutti loro.
window.load può essere utilizzato nell'evento onload del corpo in questo modo (ma ti consiglio vivamente di evitare di mescolare codice come questo nell'HTML, in quanto è fonte di confusione in seguito):
$(window).load(function()
{
// executes when complete page is fully loaded, including all frames, objects and images
alert("(window).load was called - window is loaded!");
});$ (finestra) .load è un evento che viene generato quando il DOM e tutto il contenuto (tutto) sulla pagina viene caricato completamente come CSS, immagini e frame. Un esempio migliore è se vogliamo ottenere la dimensione effettiva dell'immagine o ottenere i dettagli di tutto ciò che la utilizziamo.
$ (document) .ready () indica che il codice in esso contenuto deve essere eseguito una volta caricato il DOM e pronto per essere manipolato dallo script. Non attenderà il caricamento delle immagini per l'esecuzione dello script jQuery.
<script type = "text/javascript">
//$(window).load was deprecated in 1.8, and removed in jquery 3.0
// $(window).load(function() {
// alert("$(window).load fired");
// });
$(document).ready(function() {
alert("$(document).ready fired");
});
</script>$ (finestra) .load generato dopo $ (documento) .ready ().
$ (window) .load è stato deprecato in 1.8 e rimosso in jquery 3.0
Penso che l' $(window).loadevento non sia supportato da JQuery 3.x
Secondo gli eventi di livello DOM 2, l' loadevento dovrebbe essere attivato document, non attivo window. Tuttavia, loadè implementato su windowin tutti i browser per compatibilità con le versioni precedenti.
$(document).ready(function(){})is$(function(){})e un'altra importante differenza rispetto a window.load è che verrà eseguita su TUTTE le chiamate future della funzione, anche dopo il DOMready iniziale.