/    Sign up×
Community /Pin to ProfileBookmark

Dynamically adding javascript to Iframe

Copy linkTweet thisAlerts:
Sep 01.2005

Hi,

I understand that iframe.contentWindow.document.open, write and close – will create a totally new page in the iframe and add it to the history stack.

I’ve tried to add javascript when writing to the iframe – but no joy. Ideally I want to dynamically create a javascript onload function that is called when the iframe is written to.

Is this possible ?

to post a comment
JavaScript

10 Comments(s) ↴

Copy linkTweet thisAlerts:
@JPnycSep 01.2005 — Should be like writing any other content to the page. How have you attempted it? Can you post the relevant code?
Copy linkTweet thisAlerts:
@RossC0authorSep 01.2005 — Hi Heres some sample code - but for some reason my variable isnt being created properly as firefox is picking up the close script tag in the content variable.

Index.html
<i>
</i>&lt;html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"&gt;
&lt;head&gt;
&lt;title&gt;Iframe Test&lt;/title&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"&gt;
&lt;script type="text/javascript"&gt;
function createIframeContent(){
var iframe = document.getElementById('testFrame');
var content = '&lt;html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"&gt;&lt;head&gt;&lt;title&gt;Iframe&lt;/title&gt;&lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"&gt;&lt;script&gt;function alertLoad(){alert("ok");}&lt;/script&gt;&lt;body onload="alertLoad();"&gt;Loaded...&lt;/body&gt;&lt;/html&gt;';

iframe.contentWindow.document.open();
iframe.contentWindow.document.write(content);
iframe.contentWindow.document.close();
}
&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;input type="button" onclick="createIframeContent()" value="Change Iframe Content"&gt;
&lt;iframe id="testFrame" name="testFrame" src="iframe.html"&gt;&lt;/iframe&gt;

&lt;/body&gt;
&lt;/html&gt;


iframe.html
<i>
</i>&lt;html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"&gt;
&lt;head&gt;
&lt;title&gt;Iframe&lt;/title&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"&gt;
&lt;/head&gt;
&lt;body&gt;
Iframe Original Content
&lt;/body&gt;
&lt;/html&gt;
Copy linkTweet thisAlerts:
@JPnycSep 01.2005 — Try 2 things, 1) try reversing the single ' and double ", and if that doesn't work, try escaping all the " like this "
Copy linkTweet thisAlerts:
@RossC0authorSep 01.2005 — still no joy - its escaping the script block when it hits the </script tag

Any other ideas?
Copy linkTweet thisAlerts:
@JPnycSep 01.2005 — Can you post the code statement as you have it now?
Copy linkTweet thisAlerts:
@RossC0authorSep 02.2005 — Its the same as posted about - swapping the quotes made no difference unfortunately..
Copy linkTweet thisAlerts:
@RossC0authorSep 06.2005 — Anybody dynamically added javascript to an iframe ?
Copy linkTweet thisAlerts:
@herodote92Sep 06.2005 — Have you tried splitting the "script" tag like this: "scr"+"ipt" (for ex) ?
Copy linkTweet thisAlerts:
@RossC0authorSep 07.2005 — Hi,

Still no joy - it seems that its the html rendering of the page that causes the problem and it sees the end script tag and stops the script.

I'm thinking I will need to create the function another way and then pass it to the iframe.
Copy linkTweet thisAlerts:
@shipscript2Sep 08.2005 — It appears to work for me if the script tags are split as recommended by herodote92.

Your string is wrapped in apostrophes, so the quotes are merely data like the rest of your text and the apostrophes indicate javascript literal data.

I added '+' in the middle of your string like this

<'+'script ...... <'+'/script....
×

Success!

Help @RossC0 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...