JSがiframe内でdomを操作する（例で解説）_javascriptスキル

次のコードを直接割り当ててテストすると理解できます:

1.html:

コードをコピー コードは次のとおりです: 無題ドキュメント ======================注: ここからテストが始まります=== = =====================

は、サブフォーム iframeA が親フォーム要素

======================iframe分割線==== == =================== ======================iframe 分割線==== ==== ================= まず、親フォームが子フォーム内のメソッドまたは要素にアクセスすることを説明します。 /p&gt ; 概要: 親フォームは、要素とは異なる方法で子フォームにアクセスします

> / /iframe の要素を取得します function getIframe(id){ return document.getElementById(id).contentWindow.document; } //親ウィンドウが子ウィンドウ要素にアクセスします function FrameDiv(){ getIframe("frameA").getElementById("ooxx").style.backgroundColor="#f00" //window.frames["iframeA"].getElementById("ooxx") . style.backgroundColor="#f00" //このフォームでは要素にアクセスできません } //親ウィンドウは子ウィンドウにアクセスしますメソッド function FrameFun(){ //getIframe ("frameB ").getsFun();//この方法ではサブフォームの特定のメソッドにアクセスできません // window.frames["iframeB"].getsFun(); alert(window.frames ["iframeB" ].getsFun()); }

a.html

コードをコピー コードは次のとおりです: 無題のドキュメント 子フォーム内の要素にアクセスする親フォームをテストするために使用されます 子ウィンドウ B がフォーム A

1 の要素にアクセスすることをテストするために使用されます。子ウィンドウ iframeA が親ウィンドウの要素にアクセスします

//子ウィンドウは親ウィンドウの要素にアクセスします function FrameToPdiv(){ 親。 document.getElementById("pox").style.color="#fff"; parent.document.getElementById("pox").style.backgroundColor="#f0a0f0" } //サブウィンドウへのアクセス親ウィンドウメソッド function FrameToPfun(ss){ parent.testP("ssss"); } //iframeB のテストメソッド function testBA( ){ alert("iframeB アクセスのテスト方法") }

b.html コードをコピー コードは次のとおりです: 無題のドキュメント

サブフォーム A の要素にアクセスします" onclick="frameTframeDiv()" /> //サブフォーム B はサブフォーム A の要素にアクセスします function FrameTframeDiv(){ / /parent.document .getElementById("frameA").contentWindow.document.getElementById("divooxx").style.color="#a0c0f0"; //parent.document.getElementById("frameA").contentWindow.getElementById( "divooxx").style.backgroundColor="#000" var _bframe=parent.getIframe("frameA");//子フォームは親フォームのメソッドにアクセスします _bframe.getElementById(" divooxx")。 style.color="#a0c0f0"; _bframe.getElementById("divooxx").style.backgroundColor="#000"; } //サブフォーム B はボディ A のサブウィンドウ A のメソッドにアクセスします 関数 FrameTframeFun(){ window.parent.frames["frameA"].testBA(); } function getFun(){ return "sssssss"; } //getFun()