Document.readyState
Sumário
Sintaxe
var string = document.readyState;
Valores
O readyState
de um documento pode ser um dos seguintes:
loading
- O
document
ainda está carregando. interactive
- O documento terminou de ser carregado e o documento foi analisado, mas sub-recursos, como imagens, folhas de estilo e quadros, ainda estão sendo carregados.
complete
- O documento e todos os sub-recursos terminaram de carregar. O estado indica que o
load (en-US)
evento está prestes a disparar.
Exemplos
Diferentes estados de readyState
switch (document.readyState) { case "loading": // O documento esta carregando break; case "interactive": // O documento acabou de carregar. Nós podemos acessar os elementos do DOM. //
mas sub-recursos, como imagens, folhas de estilo e quadros, ainda estão sendo carregados.var span = document.createElement("span"); span.textContent = "A <span> element."; document.body.appendChild(span); break; case "complete": // A pagina carregou por completo. console.log("The first CSS rule is: " + document.styleSheets[0].cssRules[0].cssText); break; }
readystatechange como uma alternativa para DOMContentLoaded evento
//
alternativa para DOMContentLoaded eventodocument.onreadystatechange = function () { if (document.readyState === 'interactive') { initApplication(); } }
readystatechange como uma alternativa para load evento
//
ternativa para load eventodocument.onreadystatechange = function () { if (document.readyState === 'complete') { initApplication(); } }
readystatechange como ouvinte de evento para inserir ou modificar o DOM antes de DOMContentLoaded
document.addEventListener('readystatechange', event => {
if (event.target.readyState === 'interactive') {
initLoader();
}
else if (event.target.readyState === 'complete') {
initApp();
}
});