親ページから iframe 内の JavaScript 関数を呼び出すにはどうすればよいですか?

親ページから iframe 内の JavaScript 関数を呼び出す

iframe が Web ページ内に埋め込まれている場合、分離されたサンドボックス環境が作成されます。親ページからその中のコードを取得します。ただし、親ページから iframe で定義された JavaScript 関数にアクセスして呼び出す必要があるシナリオが存在する場合があります。

課題を理解する

標準的なアプローチでは、この場合、iframe 内からのparent.functionName() は機能しません。これは、親ページが iframe の直接の親ではなく、iframe のサンドボックス仮想環境であるためです。

Iframe のコンテンツ ウィンドウへのアクセス

アクセスして呼び出すにはiframe 内の JavaScript 関数では、その contentWindow プロパティへの参照を取得する必要があります。このプロパティは iframe の window オブジェクトを表し、そのグローバル変数、関数、および DOM へのアクセスを提供します。

JavaScript 関数の呼び出し

contentWindow を取得したら参照すると、次のコマンドを使用して iframe 内で JavaScript 関数を呼び出すことができます。構文:

document.getElementById('iframeID').contentWindow.functionName();

ここで、iframeID は iframe の id 属性です。

window.frames を使用したフレームへのアクセス

または、次のこともできます。 window.frames を使用して iframe にアクセスします。この方法を使用する場合は、最新のブラウザーによってはサポートされていない可能性があることに注意してください。このアプローチの構文は次のとおりです。

window.frames[0].frameElement.contentWindow.functionName();

例

iframe の ID が「targetFrame」で、呼び出したい関数が「targetFunction」であるとします。 ()":

document.getElementById('targetFrame').contentWindow.targetFunction();

以上が親ページから iframe 内の JavaScript 関数を呼び出すにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。