How to run JS code when the whole page is loaded, including images (real full)

I want to execute a script after loading the whole page when it is complete.

Current Method:

window.onload=document.getElementById('loaded').value=1; 

This is not very good, as some images are still loading, and the page did not complete the download for real. What am I doing wrong?

Of course, does not work for me in Chrome and Firefox. The fact is that I run the code after, which returns the status of 204, and this blocks future downloads. But he seams this status 204 returns before the page has finished loading. So I need to execute the code after the page loads.

EDIT

customize the page that makes the framework

 <iframe id="myframe" height=1 width=1></iframe> <script type="text/javascript"> window.onload=document.getElementById('myframe').src='http://link to a frame braker page'; </script> 

when you put the above code on the page, it loads the iframe before the page is fully loaded. Just put a warning on the iframe page and try on a slower server, where your parent page contains large images, etc.

+4
source share
3 answers

window.onload = document.getElementById ('loaded') value = 1 ;.

You forgot to turn this into a function. What are you talking about:

 document.getElementById('loaded').value= 1; window.onload= 1; 

Obviously, this is not very effective as a load detector. You probably meant:

 window.onload= function() { document.getElementById('loaded').value= '1'; }; 
+4
source

The window.onload event should wait for the images to load before it fires:

The download event is triggered at the end of the document loading process. At this point, all the objects in the document are in the DOM, and all images and subframes are finished loading.

Source: Mozilla Dev Center: window.onload

For further reading, you can check out the following post:


UPDATE:

The reason your implementation is not working is identified by bobince in another answer . The solution is to use:

 window.onload = function() { document.getElementById('loaded').value = '1'; }; 
+4
source

If you can use jquery, take a look at the FrameReady plugin.
Check out this question . for more information

-1
source

Source: https://habr.com/ru/post/1306673/


All Articles