Come rilevare se è stato licenziato Domcontentload

Question

Sto cercando di aiutare a sviluppare una biblioteca e per questo sto cercando di lavorare con il caricamento della pagina.
Nel processo voglio rendere la libreria completamente compatibile con l'uso di Defer e Async.

Quello che voglio è semplice:
Come posso sapere che DomContentload è stato licenziato quando viene eseguito il file?

perchè è così difficile?
In IE, document.readystate show interactive prima di DomContentload.
io non Usa il rilevamento del browser in alcun modo, è contro la politica di me e del resto dei partecipanti.

Qual è l'alternativa corretta?

Modificare:

Sembra che non fossi abbastanza chiaro. Io sono non Interessato a sapere se l'evento di carico si è già verificato !!! Sapevo già come risolvere quel problema! Voglio sapere come risolvere con Domcontentload !!!

Answer 1

Per vedere se tutte le risorse nella pagina sono state caricate:

if (document.readyState === "complete" || document.readyState === "loaded") {
     // document is already ready to go
}

Questo è stato supportato in IE e Webkit per molto tempo. È stato aggiunto a Firefox in 3.6. Ecco il spec. "loaded" è per i browser safari più vecchi.

Se vuoi sapere quando la pagina è stata caricata e analizzata, ma tutte le sottobuse non sono state ancora caricate (il che è più simile a DOMContentLoaded), puoi aggiungere il valore "interattivo":

if (document.readyState === "complete" 
     || document.readyState === "loaded" 
     || document.readyState === "interactive") {
     // document has at least been parsed
}

Oltre a questo, se vuoi davvero solo sapere quando DomContentload ha sparato, allora dovrai installare un gestore di eventi per quello (prima che spara) e impostare una bandiera quando spara.

Questa documentazione MDN è anche una buona lettura sulla comprensione di più sugli stati DOM.

Answer 2

Il document.readyState è cambiato quando questo evento viene licenziato. Quindi puoi controllare il readyState Valore e in questo modo racconta se l'evento è stato licenziato o meno. Ecco un codice da eseguire start() Quando il documento è pronto per questo:

if (/comp|inter|loaded/.test(document.readyState)){
    // In case DOMContentLoaded was already fired, the document readyState will be one of "complete" or "interactive" or (nonstandard) "loaded".
    // The regexp above looks for all three states. A more readable regexp would be /complete|interactive|loaded/
    start();
}else{
    // In case DOMContentLoaded was not yet fired, use it to run the "start" function when document is read for it.
    document.addEventListener('DOMContentLoaded', start, false);
}

Answer 3

Prova questo o guarda questo collegamento

<script>
    function addListener(obj, eventName, listener) { //function to add event
        if (obj.addEventListener) {
            obj.addEventListener(eventName, listener, false);
        } else {
            obj.attachEvent("on" + eventName, listener);
        }
    }

    addListener(document, "DOMContentLoaded", finishedDCL); //add event DOMContentLoaded

    function finishedDCL() {
        alert("Now DOMContentLoaded is complete!");
    }
</script>

Nota

Se hai un <script> dopo un <link rel="stylesheet" ...>

La pagina non finirà l'analisi - e DOMContentLoaded non sparare - fino a quando il foglio di stile non sarà caricato

Answer 4

Se vuoi sapere "esattamente" se DomContentload è stato licenziato, potresti usare una bandiera booleana come questa:

var loaded=false;
document.addEventListener('DOMContentLoaded',function(){
loaded=true;
...
}

Quindi verificare con:

if(loaded) ...

Answer 5

Ecco la cosa, se qualche altra libreria (come jQuery) già usata da Domcontentload, non puoi usarla di nuovo. Può essere una cattiva notizia, perché finisci senza essere in grado di usarlo. Dirai, perché non usare semplicemente $(document).ready(), perché, no!, non tutto deve usare jQuery, specialmente se è una biblioteca diversa.