注: iframe がページに埋め込まれると、実際には新しい完全なウィンドウ オブジェクトが dom 上に作成されます
iframe からメイン フォームを取得します
window.top (トップ ウィンドウのウィンドウ オブジェクト) )
window.parent (現在の iframe の親ウィンドウ)
多層ネストされた iframe window.parent.parent.... を取得します
必要なウィンドウを取得した後、親ドキュメントのコンテンツを操作できます
例: window.top.document.getElementById(''xxx");
メインフォームで iframe が属するウィンドウオブジェクトを取得します
window.frames['iframe の名前'] (経由iframe の name 属性)
document.getElementById("HtmlEdit").contentWindow; (ネイティブでは、すべての主要なブラウザが contentWindow 属性をサポートしています)
例:
例 (メイン ウィンドウで iframe の更新を操作します ):
document.getElementById('FrameID').contentWindow.location.reload(true);
jquery を使用して attr の更新を直接操作することもできます: $('#frameID').attr ('src','http://xxx');
ブラウザの同一オリジン ポリシー: 1. 異なるソースからのドキュメントを ajax 経由でリクエストすることはできません。 2. 異なるドメインのフレーム間で JS 対話を実行することはできません。ブラウザ
iframe にクロスドメインが含まれる場合、この時点で iframe ウィンドウ オブジェクトへのアクセスが制限されます
Chrome プロンプト:
Uncaught SecurityError: オリジン "http://123.57.6.131" のフレームへのアクセスがブロックされましたオリジン「http://localhost:9000」のフレーム。プロトコル、ドメイン、およびポートが一致する必要があります。
firefox プロンプト:
プロパティ "xxx" へのアクセス許可が拒否されました
ここには 2 つの状況があります。
1 . サブレベル ドメイン名
間のクロスドメイン 2. 全く異なるドメイン名間のクロスドメイン
1. サブレベル ドメイン名間のクロスドメイン操作では、同じ document.domain を指定するだけです
例:http://www.example.com/a.html と http://example.com/b.html
これら 2 つのページの document.domain を同じドメイン名に設定するだけです。 document.domain をそれ自身またはそれ以上の上位の親ドメインにのみ設定でき、メイン ドメインも同じである必要があり、障害なくアクセスして対応する操作を実行できます
2.全く異なるドメインの場合は、値を渡します(iframeが属するwindowオブジェクトのlocation.hashを通して値を渡します)
location.hashを操作しても、 iframe 全体を再ロードして更新するには、これを実行してから、iframe の onhashchange イベントをリッスンすることができます
例:
//主窗体中传递json数据到iframe:var url;var data = {name:'xx',age:26};var tmp = encodeURI( JSON.stringify(center) );$('#iframe_id').attr('src',url+'#'+tmp);//iframe中接收 window.onhashchange = function () { var hash_str = decodeURI( window.location.hash.replace('#','').toString() ); var data = JSON.parse( hash_str ); }// 这样一旦当url hash值改变,iframe就可以进行相应调整// 如果要兼容ie8之类不支持onhashchange事件的浏览器// 可以用setInterval()判断是否发生改变,然后调用相应函数
参考: http://stackoverflow.com/questions/3090478/jquery-hashchange-イベント
2.2 iframe のメインフォームに渡されます
メインフォーム a と同じドメイン名で新しいページ c を作成する必要があります
次に iframe b に埋め込まれた iframe の src 値はページ c、
c の URL ハッシュ値は iframe b でも同様に操作でき、
a、c は同じドメイン名で透過的にアクセスでき、c の window オブジェクトへのクロスドメインアクセスはありません。同一起源の制限。