Javascript と iframe_javascript のスキルについて

iframe に埋め込まれたページの場合、親ページと子ページの両方が同じドメイン内またはサブドメイン間で簡単に読み取りおよび書き込み操作を実行でき、完全に異なるドメインの場合はハッシュを変更することで通信することもできます。以下では、9 つ​​の異なるブラウザ (バージョン) でのデータ転送と変更との互換性をテストしました。
同じドメイン内またはサブドメイン間で iframe 内のコンテンツを読み取りおよび書き込みます
親ページのサブページの読み取りおよび書き込み:

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

<script><br>window.onload = function () {<br> /*<br> * 以下ノードを取得するには 2 つの方法が使用されます。どのようなコンテンツ形式でも受け入れられます。 <br> * IE6 と IE7 は contentDocument 属性をサポートしていないため、ここでは共通の <br> が使用されます * window.frames["iframe Name"] または window.frames[index]<br> */<br> var d = window.frames["test-iframe"].document;<br> d.getElementsByTagName('h1')[0].innerHTML = 'pp';<br>alert(d.getElementsByTagName('h1')[0 ].firstChild.data);<br>}<br></script>

注: には必ず window.onload を渡してください。メソッド iframe 内のノードにアクセスします。アクセスしないと、ブラウザーからアクセスが拒否されたというエラーが表示されます。 IE8、Firefox3.6、Opera11では、DOMReady中にiframe内のノードにもアクセスできます。
子ページの読み取りおよび書き込み操作、親ページ:

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

<script><br>parent.document.getElementsByTagName('h1')[0].innerHTML = 'pp';<br>alert(parent.document.getElementsByTagName('h1') )[0] .firstChild.data);<br></script>

概要:
•1 テストは IE6 に合格、 IE7、IE8、Firefox2.0、Firefox3.0、Firefox3.6、Chrome8、Opera11、Safari5.
•2 データを確認し、document.getElementById('id name').contentDocument が wi​​ndow.frames と等しいことを確認します。 ["iframe Name"]. document.
•3 サブドメインを越える場合は、domain.domain = 'xxx.com';
iframe コンテンツのクロスドメイン操作を追加する必要があります
2つのWebページが異なるドメインにある場合、データの相互呼び出しを実現するには、JSを通じてlocationオブジェクトのハッシュ属性の値を変更することによってのみ相互通信を実現できます。
親ページ:

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

<script><br>function sendRequest() {<br> document.getElementById('test-iframe' ).src = '#a';<br>}<br>var interval = window.setInterval(function(){<br> if(location.hash) {<br>alert(location.hash);<br> window.clearInterval (間隔);<br> }<br>},1000);<br></script>

サブページ:

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

RRRRRR

< ;script>
var url = 'http://www.xxx.com/father.html';
oldHash = self.location.hash,
newHash,
interval = window.setInterval( function(){
newHash = self.location.hash;
if(oldHash != self.location.hash) {
document.getElementsByTagName('h1')[0].innerHTML = 'pp' ;
//alert (parent.location.href); // このコメントを削除すると、ブラウザは許可がないことを示すプロンプトを表示します
parent.location.href = url '#b';
ウィンドウ。 clearInterval(間隔);
}
},500);

概要:
•1 IE6、IE7、IE8、Firefox2.0、Firefox3.0、Firefox3.6、Chrome8、Opera11、Safari5 (IE6 を除く) でテスト済み, IE7 を除き、ハッシュが変更されている限り、ブラウザの履歴に記録されます。
•2 子ページでparent.location.replaceメソッドを使用して、親ページがサーバーにリクエストを送信してジャンプするのを防ぎ、理論的にはブラウザーが履歴を記録しないようにしようとしましたが、記録されませんでした。仕事。
•2 子ページには親ページの URL を読み取る権限はありませんが、親ページの URL に書き込むことができるため、クロスドメイン操作を行う場合は親ページの URL を知っている必要があります事前にページを読んでください
フロントエンドはクロスドメインの問題を解決するため、制限が比較的大きいため、サーバー側のソリューションを使用するのが最善です