JS iFrameの読み込みが遅い問題を解決する方法-jsチュートリアル-php.cn

JS iFrameの読み込みが遅い問題を解決する方法

高洛峰

リリース： 2017-01-12 11:05:41

オリジナル

2154 人が閲覧しました

プロジェクトでは、多くの場合、iframe を動的に追加し、追加された iframe に対して関連する操作を実行する必要があります。iframe の読み込みが遅いのはなぜですか?この質問を念頭に置いてこの記事を読んで答えを見つけてみましょう。

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>

ログイン後にコピー

問題:

上記の aaa.html を実行すると、alert の値がコード内に直接出力されないことがわかりますが、ボタンをクリックすると値が出力されます。

分析:

ページの読み込み中に iframe に遭遇すると、そこに直接ジャンプし、次のコンテンツを読み込み、その後 iframe を読み込むために戻ってくることももちろん理解できます。 iframe に遭遇すると、iframe をロードするために別のスレッドが開かれますが、新しい IO 操作に時間がかかるため、iframe のロードはページ下部の js コードの実行よりもまだ遅くなります。上記の問題が発生します。

解決策:

iframe 内のオブジェクトが正常に取得できるように、js コードに遅延を追加します (具体的な遅延時間は個人の経験によって異なります)。

<SCRIPT LANGUAGE="JavaScript">
setTimeout("alert(bbb.document.all.txt.value)",1500);
</SCRIPT>

ログイン後にコピー

結論: ページに iframe が含まれている場合、js を介して iframe 内のオブジェクトを操作したい場合は、iframe が読み込まれるまで待ってから操作する必要があります。そうしないと、目的のオブジェクトが取得できません。

上記は、編集者が紹介した JS iFrame の読み込みが遅い問題の解決策です。お役に立てば幸いです。同時に、PHP 中国語 Web サイトをご利用いただき、誠にありがとうございます。

JS iFrame の読み込みが遅い問題を解決する方法に関するその他の関連記事については、PHP 中国語 Web サイトに注目してください。