JavaScript iframe プログラミング関連のコード_JavaScript スキル

最近、いくつかのプロジェクトで iframe が使用されています。場合によっては、ページ内に複数の iframe があり、複数の iframe が相互の機能や親ウィンドウの機能にアクセスする必要があります。今日時間があれば、ページフレームのプログラミングを整理します。
ページ内のすべてのフレームは、コレクションの形式でウィンドウ オブジェクトの属性として提供されます。例: window.frames は、ページ内のすべてのフレームのコレクションを表します。これは、フォーム オブジェクト、リンク オブジェクト、ピクチャに似ています。違いは、これらのコレクションがドキュメントのプロパティであることです。したがって、サブフレームを参照するには、次の構文を使用できます:

コードをコピーします コードは次のとおりです:

window.frames["frameName"];
window.frames.frameName
window.frames[index]

このうち、window という単語も使用できます。フレーム名がページ内の最初のフレームであると仮定すると、self に置換または省略され、次の記述は同等です:

コードをコピーコードは次のとおりです:

self.frames["frameName"]
self.frames[0]
frames[0]

frameName
各フレームは HTML ページに対応するため、このフレームは独立したブラウザ ウィンドウでもあり、フレームへのいわゆる参照はウィンドウ オブジェクトへの参照でもあります。この window オブジェクトを使用すると、window.document オブジェクトを使用してページにデータを書き込んだり、window.location プロパティを使用してフレーム内のページを変更したりするなど、その中のページを簡単に操作できます。

以下では、異なるレベルのフレームワーク間の相互参照を紹介します。
1.親フレームから子フレームへの参照
上記の原則を理解すると、親フレームから子フレームを参照することは非常に簡単です。
window.frames["frameName"];
これは、ページ内のframeNameという名前の参照Aサブフレームです。サブフレーム内のサブフレームを参照したい場合は、ウィンドウ オブジェクトの性質に従って、参照されるフレームを次のように実装できます。
window.frames["frameName"].frames["frameName2"]; > このようにして参照が行われます。 第 2 レベルのサブフレームなどになると、多層フレームワークの参照が実現できます。

2．子フレームから親フレームへの参照 各ウィンドウ オブジェクトには、親フレームを表すparent属性があります。フレームがすでにトップレベルのフレームである場合、window.parent はフレーム自体も表します。

3．兄弟フレーム間の参照 2 つのフレームが同じフレームのサブフレームである場合、それらは兄弟フレームと呼ばれます。たとえば、ページには 2 つのサブフレームが含まれます。 🎜>

コードをコピー コードは次のとおりです:

< ;/frameset>


frame1 では、次のステートメントを使用して Frame2 を参照できます:

self.parent.frames["frame2"];異なるレベルのフレームワーク間の相互参照

フレームワークのレベルは、最上位のフレームワーク用です。レベルが異なる場合、自分がいるレベルと、他のフレームのレベルと名前がわかっていれば、フレームによって参照されるウィンドウ オブジェクトのプロパティを使用して、相互に簡単にアクセスできます。たとえば、
self.parent.frames["childName "].frames["targetFrameName"];
5.最上位フレーム
への参照は、parent 属性と似ています。window オブジェクトにも top 属性があります。これは、トップレベルのフレームへの参照を表し、フレーム自体がトップレベルのフレームであるかどうかを判断するために使用できます。例:


Copy code

コードは次のとおりです: //このフレームがトップレベルのフレームかどうかを判断しますif(self==top){

//dosomething

}