SoFunction
Updated on 2025-02-28

How to solve the problem of slow loading of JS iFrame

In the project, you often need to dynamically add iframes and then perform related operations on the added iframes. Sometimes you will encounter the reason why the iframe loads very slowly and how to solve it? Let’s learn this article with this question and find the answers!

<HTML>
<HEAD>
<TITLE>aaa</TITLE>
</HEAD>
<BODY>
<IFRAME src="" name=bbb width="100%" height="190"> </IFRAME>
<INPUT type="button" value="Show text control value" onclick="alert()"> 
<SCRIPT LANGUAGE="JavaScript">
alert();
</SCRIPT>
</BODY>
</HTML>


<HTML>
<HEAD>
<TITLE>bbb</TITLE>
</HEAD>
<BODY>
<input type=text name=txt value="guoguo"> 
</BODY>
</HTML>

question:

Execute the above discovery code and directly the alert value is not typed, but clicking the button can type its value.

analyze:

When the page is loaded, when you encounter an iframe, you will jump over it, load the following content, and then come back to load the iframe. Of course, it can also be understood that when you encounter an iframe, you open a thread to load the iframe. However, because it is time-consuming to involve new IO operations, the loading of the iframe is still later than the js code execution at the bottom of the page, so the above problem occurs.

Solution:

Add a delay in the js code (the specific delay can be based on personal experience), so that you can ensure that the objects in the iframe are obtained normally.

<SCRIPT LANGUAGE="JavaScript">
setTimeout("alert()",1500);
</SCRIPT>

Conclusion: When an iframe is included in a page, if we want to operate the object in the iframe through js, we must wait until the iframe is loaded before operating, otherwise we will not get the desired object.

The above is the solution to slow loading of JS iFrame introduced to you. I hope it will be helpful to you. I also thank you very much for your support for my website!