jQuery/JavaScript: accessing contents of an iframe
I would like to manipulate the HTML inside an iframe using jQuery.
I thought I'd be able to do this by setting the context of the jQuery function to be the document of the iframe, something like:
$(function(){ //document ready
$('some selector', frames['nameOfMyIframe'].document).doStuff()
});
However this doesn't seem to work. A bit of inspection shows me that the variables in frames['nameOfMyIframe'] are undefined unless I wait a while for the iframe to load. However, when the iframe loads the variables are not accessible (I get permission denied -type errors).
Does anyone know of a work-around to this?
I think what you are doing is subject to the same origin policy. This should be the reason why you are getting permission denied type errors.
If the <iframe> is from the same domain, the elements are easily accessible as
$("#iFrame").contents().find("#someDiv").removeClass("hidden");
Reference
$(document).ready(function(){
$('#frameID').load(function(){
$('#frameID').contents().find('body').html('Hey, i`ve changed content of <body>! Yay!!!');
});
});
上一篇: JSON和JSONP有什么区别？