從iframe訪問和更改父頁面（使用jquery）

Question

有沒有辦法如何從iframe訪問parrent頁面（和更改parrent頁面）？

<body>
   <iframe src="frame1.html" name="frame1" height="100%"></iframe>
   <div id="test1"></div>
</body>

在frame1.html是<a href=..>和我要添加文本“ <h1>clicked</h1>到<div id="test1"></div>當<a href..>被點擊了。

謝謝。

Answer 1

如果您的子頁面（frame1.html）與父頁面位於同一個域，您可以在子窗口中編寫如下代碼：

 $('#test1', parent.document).html('<h1>clicked</h1>');

第二個參數提供搜索第一個參數匹配的元素的context 。 該文件在此處： http ： //api.jquery.com/jQuery/#jQuery-selector-context

 jQuery( selector [, context ] )

所以，你的代碼（frame1.html）可能是這樣的：

 <a href="..." 
  onclick="$('#test1', parent.document).html('<h1>clicked</h1>');">click me</a>

希望這可以幫助。

Answer 2

重要提示：訪問進出I幀才有可能，如果雙方，父母和iframe都來自同一個域，否則你有由於同源策略的訪問權限。

請注意，這兩個部分都有自己的文檔。 從iframe訪問父對象很簡單

parent.document

從父母那里它是以下之一：

window.frames['iframeName']

(window.frames.length /*gives you the number of iframes in your document*/ )

或者用id引用它並執行以下操作（注意支持！）

var iframe = document.getElementById('iframe');
var doc = iframe.contentDocument? iframe.contentDocument:iframe.contentWindow.document;

Answer 3

下面的代碼應該可以正常工作：

$(parent.document).find("#selector");

選擇器來自父文檔以執行某些操作。 例如：

$(parent.document).find("#selector").remove();