How can i check by JS if a page has full loaded and rendered its controls?

Things like this

document.addEventListener('DOMContentLoaded', function() {
    alert('JS');
}, false);

and this

$(document).ready(function(){
    alert('JQuery');
});

Returns me when the page is loaded, but its NOT my case. My page has alot of Iframes inside, and even with the page full loaded the iframes itself arent yet.

So i need to know when the page is FULL loaded and rendered. Looks like the brownser page icon "does it" for me, since it changes when the page is done, like in example below.

Page NOT ready!

Page ready!

How can i check by JS if a page has full loaded and rendered its controls?

Things like this

document.addEventListener('DOMContentLoaded', function() {
    alert('JS');
}, false);

and this

$(document).ready(function(){
    alert('JQuery');
});

Returns me when the page is loaded, but its NOT my case. My page has alot of Iframes inside, and even with the page full loaded the iframes itself arent yet.

So i need to know when the page is FULL loaded and rendered. Looks like the brownser page icon "does it" for me, since it changes when the page is done, like in example below.

Page NOT ready!

Page ready!

• javascript
• jquery
• browser
• client-server

• $(window).load(function() return true when whole page is properly loaded. – Sumanta736 Commented Apr 6, 2016 at 12:30

1 Answer 1

Use $(window).load(function() {}); OR window.onload = function () {}

window.onload called once all the html tags/script, images, frames are fully load.

References :-

Difference between document.ready and window.onload

DOMContentLoaded