web-dev-qa-db-ja.com

JavaScriptでiframe要素にアクセスする

Iframe内にテキストエリアがあるWebページがあります。 JavaScriptを使用して、子ページからこのtextareaの値を読み取る必要があります。

現在、JavaScriptでwindow.parent.getelementbyID().valueを使用することにより、iframe内のtextareaを除く親ページのすべてのコントロールの値を取得できます。

誰もこの問題を解決するためのポインタを教えてもらえますか？

javascriptiframe
26
archana roy

Iframeが親ページと同じドメインにある場合、document.framesコレクションを使用して要素にアクセスできます。

// replace myIFrame with your iFrame id
// replace myIFrameElemId with your iFrame's element id
// you can work on document.frames['myIFrame'].document like you are working on
// normal document object in JS
window.frames['myIFrame'].document.getElementById('myIFrameElemId')

Iframeが同じドメインにない場合、ブラウザはセキュリティ上の理由からそのようなアクセスを防ぐ必要があります。

51
RaYell

windowではなく、documentからフレームにアクセスする必要があります

window.frames['myIFrame'].document.getElementById('myIFrameElemId')
15
Mena Joseph

window.frames['myIFrame'].document.getElementById('myIFrameElemId')

私のために働いていませんが、私は別の解決策を見つけました。つかいます：

window.frames['myIFrame'].contentDocument.getElementById('myIFrameElemId')

FirefoxとChromeで確認しました。

14
user964357

Iframe 既にロードされているであることを確認してください。 jQueryを使用しない古いが信頼できる方法：

<iframe src="samedomain.com/page.htm" id="iframe" onload="access()"></iframe>

<script>
function access() {
   var iframe = document.getElementById("iframe");
   var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
   console.log(innerDoc.body);
}
</script>
3
lukyer

このコードは私のために働いた：

window.frames['myIFrame'].contentDocument.getElementById('myIFrameElemId');
2
Abdelkreem Mostafa Saed

2つの方法

window.frames['myIFrame'].contentDocument.getElementById('myIFrameElemId')

OR

window.frames['myIFrame'].contentWindow.document.getElementById('myIFrameElemId')
1
Vlad