how can i load <script>'s into an iframe?

Question

I've got the logic working to append into my iframe from the parent

this works:

$('#iframe').load(function() {
  $(this).contents().find('#target').append('this text has been inserted into the iframe by jquery');    
});

this doesn't

$('#iframe').load(function() {
  $(this).contents().find('body').append('<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"&gt;&lt;/script&gt;');    
});

.lf

The problem is something to do with the inserted script tags not being escaped properly. Half of the javascript is becomes visible in the html, like the first script tag has been abruptly ended.

Answer 1

I'm a bit surprised that isn't working [Edit: No longer surprised at all, see mtrovo's answer.]...but here's what I do, which is mostly non-jQuery per your comment below but still quite brief:

var rawframe = document.getElementById('theframe');
var doc = rawframe.contentDocument;
if (!doc && rawframe.contentWindow) {
    doc = rawframe.contentWindow.document;
}
var script = doc.createElement('script');
script.type = "text/javascript";
script.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js";
document.body.appendChild(script);

Off-topic: I really wouldn't give an iframe (or anything else) the ID "iframe". That just feels like it's asking for trouble (IE has namespace issues, and while I'm not aware of it confusing tag names and IDs, I wouldn't be completely shocked). I've used "theframe" above instead.

Answer 2

i just thought i should share this plugin as well, in case anyone would be interested

http://ideamill.synaptrixgroup.com/?page_id=18

Answer 3

Maybe the error is with your string, never create a string in javascript with a literal < /script> in it.

$('#iframe').load(function() {
  $(this).contents().find('body').append('<scr' + 'ipt type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"&gt;&lt;/scr' + 'ipt>');    
});