How to find a div inside of an iframe

Question

I am trying to use jquery to find a div inside an iframe. Is there a better way than the one I\'m using below?

$(\'#Iframe\').contents().find(\'#MyDiv\')

fu         


        

Answer 1

Use selector context:

var frame = $('#frame_id');
var div = $('#mydiv', frame);

Answer 2

I don't think the jQuery can access the contentWindow/Document's content in that way. In the past, I've had to do this:

$('#iframe').each(function() {
    $('#MyDiv', this.contentWindow.document||this.contentDocument);
});

** Note that this.contentWindow||this.contentDocument is required to work correctly across IE and most other browsers. Once you get the content window, you need to select the document. Then you can use jQuery to manipulate or traverse the DOM, but only if the iframe's source is in the same domain.

** Updated to fix error where we don't specify the document after we get the contentWindow/Document.

Answer 3

This will only work if the Iframe source is in the same domain as your page, if not the browser wont allow it for security reasons