access and change parent page from iframe (with jq

2020-02-02 12:03发布

站内问答 / JavaScript
1241 3 5

is there any way how to access from iframe to parrent page (and change parrent page)?

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

In frame1.html is <a href=..> and I want to add text "<h1>clicked</h1>" into <div id="test1"></div>, when the <a href..> was clicked.

Thanks.

3条回答
聊天终结者
2楼-- · 2020-02-02 12:25

If your child page (frame1.html) is located at the same domain as the parent page, You can write a code like below in the child window :

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

The second parameter provides the context in which to search the element matched by the first parameter. The Document is here:http://api.jquery.com/jQuery/#jQuery-selector-context 

 jQuery( selector [, context ] )

So, your code (frame1.html) could go like this:

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

Hope this helps.

查看更多
0人赞 添加讨论(0) 举报
别忘想泡老子
3楼-- · 2020-02-02 12:33

Important note: Accessing in and out iframes is only possible, if both, parent and iframe are from the same domain, else you have no access due to Same Origin Policy.

Note, that both parts have their own document. Accessing the parent object from iframe is simple with

parent.document

and from parent it is one of the following:

window.frames['iframeName']

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

or reference it with id and do the following (watch out for support!)

var iframe = document.getElementById('iframe');
var doc = iframe.contentDocument? iframe.contentDocument:iframe.contentWindow.document;
查看更多
0人赞 添加讨论(0) 举报
冷血范
4楼-- · 2020-02-02 12:45

The code below should work fine:

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

The selector is from the parent document to perform some action. For Example: 

$(parent.document).find("#selector").remove();
查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(5)