このソリューションは生産的なサイトで使用します。
だから、与えられた：
1.スクロールバーなしで他のドメインのiframeページに表示する必要があります
2. iframe内では、遷移が発生する場合があります
3. iframe内のサイトは、過負荷なしで高さを変更できます（AJAXまたは単にいくつかの不可視の要素を明らかにする）
4.含まれるページに最小限のコードを含める必要があります
5.解決策は閲覧履歴を損なわず、人気のあるブラウザーの現在のバージョンで動作するはずです
6.ソリューションは、master.siteとwww.master.siteの両方のケースで機能するはずです。
解決策：
メインサイトmaster.siteにiframe_height.jsとheight.htmlの2つのファイルを作成する必要があります。
ページ自体で、id = "iframe"のiframeを作成します。 headのドメインslave.siteに含まれるページに、javascript http://master.site/iframe_height.jsへのリンクを追加します
iframe_height.js：
var __hc = {<br> i: null , // <br> h: 0, // <br> iframes: [ null , null ], // <br> path: 'master.com/height.html#' , // height.html <br> // <br> setHeight: function (height) {<br> var ifr,i;<br> for (i=0;i<2;i++) {<br> if ( this .iframes[i]) this .iframes[i].parentNode.removeChild( this .iframes[i]);<br> ifr = document .createElement( 'IFRAME' );<br> ifr.style.display = 'none' ;<br> this .iframes[i] = ifr;<br> document .body.appendChild( this .iframes[i]);<br> ifr.src = 'http://' + (i ? 'www.' : '' ) + this .path + height;<br> }<br> },<br> // — <br> onLoad: function (full) {<br> this .checkHeight();<br> if (full) {<br> this .i = window.setInterval( this .bind( this .checkHeight), 100);<br> }<br> },<br> // , <br> checkHeight: function () {<br> var h = this .getDocHeight();<br> if ( this .h == h) return ;<br><br> this .h = h;<br> this .setHeight( this .h);<br> },<br> // , <br> getDocHeight: function () {<br> if (window.GetDocumentHeight) return window.GetDocumentHeight();<br> var D = document ;<br> return Math.max(<br> D.body.scrollHeight, D.documentElement.scrollHeight,<br> D.body.offsetHeight, D.documentElement.offsetHeight,<br> D.body.clientHeight, D.documentElement.clientHeight<br> );<br> },<br> // <br> addEvent: function (o, t, h) {<br> if (o.addEventListener) o.addEventListener(t, h, false );<br> else if (o.attachEvent) o.attachEvent( 'on' +t, h);<br> },<br> bind: function (method) {<br> var context = this , args = arguments;<br> return function () {<br> return method.apply(context, Array.prototype.slice.call(args, 1));<br> };<br> },<br> // <br> init: function (full) {<br> this .addEvent(window, 'load' , this .bind( this .onLoad, full));<br> }<br>};<br><br>__hc.init( true ); <br><br> * This source code was highlighted with Source Code Highlighter .
height.html：
< html >< head > <br> < script type ="text/javascript" > <br> // location.hash – <br> var l = location.hash.replace( '#' , '' );<br> if (l) {<br> // try catch <br> try {<br> parent.parent. document .getElementById( 'iframe' ).style.height = l + 'px' ;<br> } catch (e) {}<br> }<br> </ script > <br> </ head > <br> </ html > <br><br> * This source code was highlighted with Source Code Highlighter .
ポイントは、iframe内のiframeが同じドメインにある場合、メインウィンドウにアクセスできることです。
document.domainを使用したソリューションには欠点があり、サイトで修正するのがかなり難しいため、2つのiframeを開きます。
このソリューションを使用すると、ブラウザーの履歴は損なわれません。 動作中のiframeは毎回再作成されます。
height.html-サーバーから毎回取得するのではなく、ブラウザーのキャッシュから取得します
iframeでのドキュメントの高さの決定に関しては、クロスブラウザソリューションは見つかりませんでした。 コンテンツがiframeで削減される場合、たとえばwebkitブラウザーではdocument.bodyとdocument.documentElementの両方がiframeの高さで拡張されるため、iframe自体は減少しません。 これを行うには、GetDocumentHeight関数が定義されているかどうかを確認し、使用します。 つまり 一部のサイトで高さの計算が十分でない場合、関数を実装できます。特定の場合、ユニバーサル関数を使用するよりもはるかに簡単です。
一般的に、私は批判を待っています。