2009-02-24 22 views
7

Qualcuno può indicarmi la direzione per agganciare l'evento caricato con DOM?Come agganciare l'evento caricato con DOM?

Fondamentalmente, voglio visualizzare un caricatore mentre il dom sta caricando (non intendo le richieste Ajax - la prima volta che un utente preme una pagina)?

Grazie a tutti in anticipo

risposta

10

Tutte le biblioteche popolari Javascript hanno un "DOM caricato" evento è possibile utilizzare per questo.

In sostanza:

<html> 
<head> 
    <script> 
    // if using jQuery 
    $(document).ready(function() { $('#loading').hide(); }); 
    // if using Prototype 
    document.observe("dom:loaded", function() { $('loading').hide(); }); 
    </script> 
</head> 
<body> 
    <div id="loading">Loading...</div> 
    <!-- rest of page --> 
</body> 
</html> 
0

solo per fornire un'alternativa a jQuery, YUI evento offre una funzione onDomReady() per questo scopo pure. Ecco l'esempio dal loro sito:

<script type="text/javascript"> 

function init() { 
    YAHOO.util.Dom.setStyle("hidden_element", "visibility", ""); 
} 
YAHOO.util.Event.onDOMReady(init); 

</script> 
0

Il modo corretto per fare questo senza una libreria (e davvero, anche con una libreria, dal momento che hai a che fare con il blocco degli script e IE imprevedibilità) è quello di mettere uno script alla fine della pagina:

onLoaded = function() {...}

onLoaded()

28

Se non si utilizza un quadro, utilizzare il DOMCon tentElusso evento:

document.addEventListener('DOMContentLoaded', function() { 
    // ... 
}) 
+1

Grande! Mozilla ha un bel documento su questo: https://developer.mozilla.org/en/DOM/DOM_event_reference/DOMContentLoaded – philo

Problemi correlati