JS iFrame加載慢怎么解決
在項目中經(jīng)常要動態(tài)添加iframe,然后再對添加的iframe進行相關(guān)操作,有時候會遇到iframe加載很慢什么原因呢,該如何解決呢?帶著這個問題一起通過本文學(xué)習(xí),尋找答案吧!
aaa.html
<HTML> <HEAD> <TITLE>aaa</TITLE> </HEAD> <BODY> <IFRAME src="bbb.html" name=bbb width="100%" height="190"> </IFRAME> <INPUT type="button" value="顯示text控件值" onclick="alert(bbb.document.all.txt.value)"> <SCRIPT LANGUAGE="JavaScript"> alert(bbb.document.all.txt.value); </SCRIPT> </BODY> </HTML>
bbb.html
<HTML> <HEAD> <TITLE>bbb</TITLE> </HEAD> <BODY> <input type=text name=txt value="guoguo"> </BODY> </HTML>
問題:
執(zhí)行上面的aaa.html發(fā)現(xiàn)代碼直接alert的值沒有打出來,而點擊按鈕卻可以打出其值。
分析:
頁面加載時,遇到iframe就直接跳過去,加載下面的內(nèi)容,然后再回來加載iframe,當(dāng)然也可以理解成遇到iframe又開了一個線程來加載iframe,但是因為涉及到新的IO操作比較耗時,所以加載完成iframe還是晚于頁面下部的js代碼執(zhí)行,所以出現(xiàn)了上面的問題。
解決方法:
在js代碼中加個延遲(具體延遲多長時間可以憑個人經(jīng)驗了),這樣就可以保證正常得到iframe中的對象了。
<SCRIPT LANGUAGE="JavaScript"> setTimeout("alert(bbb.document.all.txt.value)",1500); </SCRIPT>
結(jié)論:當(dāng)一個頁面中包含了iframe時,如果我們要通過js來操作iframe中的對象,一定要等到iframe加載完畢之后再操作,否則得不到想要的對象。
以上所述是小編給大家介紹的JS iFrame加載慢的解決辦法,希望對大家有所幫助,同時也非常感謝大家對腳本之家網(wǎng)站的支持!
- js檢測iframe是否加載完成的方法
- js下判斷 iframe 是否加載完成的完美方法
- JS加載iFrame出現(xiàn)空白問題的解決辦法
- 基于JS判斷iframe是否加載成功的方法(多種瀏覽器)
- js通過iframe加載外部網(wǎng)頁的實現(xiàn)代碼
- javascript實現(xiàn)iframe框架延時加載的方法
- 動態(tài)加載js、css等文件跨iframe實現(xiàn)
- javascript firefox 自動加載iframe 自動調(diào)整高寬示例
- js中頁面的重新加載(當(dāng)前頁面/上級頁面)及frame或iframe元素引用介紹
- javascript應(yīng)用:Iframe自適應(yīng)其加載的內(nèi)容高度
- JS判斷iframe是否加載完成的方法
相關(guān)文章
javascript DOM操作之動態(tài)刪除TABLE多行
DOM動態(tài)刪除TABLE tr行的實現(xiàn)代碼,需要的朋友可以參考下。2009-12-12layui 選擇列表,打勾,點擊確定返回數(shù)據(jù)的例子
今天小編就為大家分享一篇layui 選擇列表,打勾,點擊確定返回數(shù)據(jù)的例子,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09深入了解Hybrid App技術(shù)的相關(guān)知識
這篇文章主要介紹了深入了解Hybrid App技術(shù)的相關(guān)知識,Hybrid App(混合模式移動應(yīng)用)是指介于web-app、native-app這兩者之間的app,兼具" Native App良好用戶交互體驗的優(yōu)勢 "和" Web App跨平臺開發(fā)的優(yōu)勢 ",需要的朋友可以參考下2019-07-07BootStrap Table實現(xiàn)server分頁序號連續(xù)顯示功能(當(dāng)前頁從上一頁的結(jié)束序號開始)
這篇文章主要介紹了BootStrap Table實現(xiàn)server分頁序號連續(xù)顯示功能(當(dāng)前頁從上一頁的結(jié)束序號開始),需要的朋友可以參考下2017-09-09解決WebStorm?2022.3.x?無法識別?Element?UI?2.15.11?新版本中的?el-
這篇文章主要介紹了解決?WebStorm?2022.3.x?無法識別?Element?UI?2.15.11?新版本中的?el-xxx?標(biāo)簽問題,本文給大家分享兩種解決方案,需要的朋友可以參考下2023-01-01基于javascript html5實現(xiàn)多文件上傳
這篇文章主要為大家詳細介紹了基于javascript html5實現(xiàn)多文件上傳的相關(guān)資料,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-03-03JavaScript判斷對象、數(shù)組是否包含某個屬性、某個值的方法
這篇文章主要給大家介紹了關(guān)于JavaScript判斷對象、數(shù)組是否包含某個屬性、某個值的相關(guān)資料,我們在實際的開發(fā)過程中,經(jīng)常需要判斷對象/數(shù)組是否包含某個屬性或者某個值,需要的朋友可以參考下2023-09-09