ホームページ >ウェブフロントエンド >CSSチュートリアル >EasyXDM を使用せずにクロスドメイン iframe のサイズを確実に変更するにはどうすればよいですか?
クロスドメイン iframe のサイズ変更: EasyXDM を超えて
別のドメインから iframe のサイズを変更するという課題は、長年にわたる問題でした。ウェブ開発。 EasyXDM はソリューションを提供しますが、短期的な使用と外部ドメインへの依存に関する欠点により、実用性が制限されます。
代替アプローチ
EasyXDM とは別に、いくつかの代替アプローチがあります。 「3 iframes」方法、スクロールの高さの測定、計算されたスタイル、プロキシ フレームなどの研究が行われています。ただし、これらのソリューションはいずれも普遍的に効果的であると証明されていません。
PostMessage to the Rescue
画期的なソリューションが postMessage の形で登場しました。このフレーム間通信メカニズムを活用することで、子 iframe から親ドメインに高さ情報を渡すことが可能になります。
子 iframe スクリプト
子 iframe では、JavaScript 関数 (「adjust_iframe_height」など) がドキュメントの高さを計算し、postMessage 経由で親に送信します。この関数は、iframe のロード時または動的コンテンツの変更中に呼び出すことができます。
親ウィンドウ スクリプト
親ウィンドウでは、「addEventListener」を使用してイベント リスナーが設定されます。 " 方法。子 iframe からメッセージを受信すると、それに応じて iframe 要素の高さが更新されます。
実装
このソリューションを実装するには、必要なスクリプトを以下に含めるだけです。子 iframe と親ウィンドウの両方。要素 ID と iframe ID をそれぞれの値に置き換えます。
シンプルさとブラウザー間の互換性
この postMessage ソリューションはエレガントで、ブラウザー間互換性があり、外部のメッセージを回避します。リソースの依存関係。これは、ドメイン境界を越えて iframe のサイズを変更するための信頼性が高く簡単な方法を提供し、Web 開発における長年の課題に対処します。
以上がEasyXDM を使用せずにクロスドメイン iframe のサイズを確実に変更するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。