frameまたはiframe要素内のdocumentオブジェクトを取得
frameまたはiframe要素内のdocumentオブジェクトを取得するには、element.contentDocument
オブジェクトを使用します。
element.contentDocumentオブジェクトはIE7以下、Safari9以下には対応していません。
代わりにelement.contentWindow
からdocument
オブジェクトを取得します。
- ※ frameまたはiframe要素で読み込まれているページが別ドメインである場合、クロスドメインの制約に引っかかり取得できない場合がありますのでご注意ください。
構文
var frameDocument = element.contentDocument;
IE7以下/Safari9以下
var frameDocument = element.contentWindow.document;
戻り値
取得したdocumentオブジェクトを返します。
サンプルコード
次のサンプルコードはiframeで読み込んでいるHTMLからp要素を取得する例です。
JavaScript
// iframe要素を取得
var iframeElem = document.getElementsByTagName('iframe');
// iframeで読み込まれているページからdocumentオブジェクトを取得
var iframeDocument = iframeElem[0].contentDocument || iframeElem[0].contentWindow.document;
// iframeで読み込まれているページからp要素を取得
var pElem = iframeDocument.getElementsByTagName('p')[0];
// p要素のHTMLをアラートで表示
alert(pElem.outerHTML);