Retrieving a document's parent iframe in jQuery
dom, iframe, jquery, selector
Solution
No need for jQuery at all. To get the body object of your parent, you can do this:
var parentBody = window.parent.document.body
If it's on the same domain as your iframe that you are running the code from, once you have that, you can use normal javascript on that object:
window.parent.document.getElementById("ContainingiFrame").style.height = "400px";
or with jQuery:
$("#ContainingiFrame", parentBody).height("400");
Here's an article on resizing an iframe from within the iframe with sample code: http://www.pither.com/articles/2010/11/12/resize-iframe-from-within
And, a related question/answer on resizing an iframe based on it's own content: Resizing an iframe based on content
Problem
I have a page with an iframe that has an html document within it. I need to access the iframe's id from that child document, and am having no luck getting at it with jQuery. The essential structure is this within my page: ``` <div id="ContainingDiv"> <iframe id="ContainingiFrame"> <html> <head></head> <body> </body> </html> </iframe> </div> ``` In my javascript method I can get to anything in the `<body>` tags using jQuery selectors, but cannot retrieve the iframe element in order to resize it. I've tried a few things but am admittedly not an expert in jQuery DOM navigation, particularly where iframes are involved (the iframe is in the same domain as the containing page.) Is there a way I can do this?