Podes usar o evento load
, que vai ser disparado quando todos os recursos forem carregados:
const iframe = document.getElementById('iframe');
window.addEventListener("load", function(event) {
console.log('Está tudo carregado');
iframe.style.display = 'block';
});
iframe {
display: none;
}
<iframe id="iframe" width="560" height="315" src="https://www.youtube.com/embed/gQghzrNo68s" frameborder="0" allowfullscreen></iframe>
DOCS
Para disparares o evento quando acontece só o carregamento parcial do HTML, DOCS:
O evento DOMContentLoaded é acionado quando o documento inicial HTML foi completamente carregado e analisado, sem aguardar por folhas de estilo, imagens, e subframes para encerrar o carregamento.
Fazes:
document.addEventListener("DOMContentLoaded", function(event) {
console.log("DOM completamente carregado e analisado");
iframe.style.display = 'block';
});