从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;