Javascript inside innerHTML problem

[poecke]

Recently I have troubled myself over a script which is supposed to
make the banners on my website load after the page has loaded, since
one of them is particularly slow. But of course the banner which
causes the site to become slow doesn't seem to agree with me

The original(working) script I received from the sponsor looks like
this:

<script language='JavaScript' type='text/javascript' src='http://
ads2.bom-media.nl/adx.js'></script>
<script language='JavaScript' type='text/javascript'>
<!--
if (!document.phpAds_used) document.phpAds_used = ',';
phpAds_random = new String (Math.random()); phpAds_random =
phpAds_random.substring(2,11);

document.write ("<" + "script language='JavaScript' type='text/
javascript' src='");
document.write ("http://ads2.bom-media.nl/adjs.php?n=" +
phpAds_random);
document.write ("&amp;what=zone:67");
document.write ("&amp;exclude=" + document.phpAds_used);

if (document.referrer)
document.write ("&amp;referer=" + escape(document.referrer));
document.write ("'><" + "/script>");
//-->
</script>

<noscript>
<a href='http://ads2.bom-media.nl/adclick.php?n=adbb5903'
target='_blank'><img src='http://ads2.bom-media.nl/adview.php?
what=zone:67&amp;n=adbb5903' border='0' alt=''></a>
</noscript>

Since JS doesn't like inserting scripts into innerHTML, I tried dozens
of things, and ended up with something which works with about every
other script except the one my sponsor gave me, namely:

<script type="text/javascript">
function setInnerHTMLAndExecScript (element, html) {
var newElement = element.cloneNode(false);
newElement.innerHTML = html;
element.parentNode.replaceChild(newElement, element);
}
</script>
<script type="text/javascript">
function doTest () {



html = [
' <script language=\'JavaScript\' type=\'text/javascript\' src=
\'http://ads2.bom-media.nl/adx.js\'></script>',
' <script language="JavaScript" type="text/javascript">',
' <!--',
' if (!document.phpAds_used) document.phpAds_used = ",";',
' phpAds_random = new String (Math.random()); phpAds_random =',
' phpAds_random.substring(2,11);',

' document.write ("<" + "script language=\'JavaScript\' type=
\'text/javascript\' src=\'");',
' document.write ("http://ads2.bom-media.nl/adjs.php?n=" +
phpAds_random);',
' document.write ("&amp;what=zone:67");',
' document.write ("&amp;exclude=" + document.phpAds_used);',
' if (document.referrer)',
' document.write ("&amp;referer=" + escape(document.referrer));',
' document.write ("\'><" + "/script>");',
' //-->',
' <\/script>',
' <noscript>',
' <a href=\'http://ads2.bom-media.nl/adclick.php?n=adbb5903\'
target=\'_blank\'><img src=\'http://ads2.bom-media.nl/adview.php?
what=zone:67&amp;n=adbb5903\' border=\'0\' alt=\'\' ><\/a>',
' <\/noscript> '

].join('\r\n');
setInnerHTMLAndExecScript(document.getElementById('banner_midden'),
html);
}

window.onload = doTest;
</script>

(yes, I did borrow that example from someone on this usegroup)

It works, but, it doesn't load 'inside' the div container, but rather
just loads the banner in a blank page(and doesn't end loading, for
some reason).

Please help me. I've spent hours on this bugger... I'd at least like
to see my efforts not be in vain..

Thanks a bunch,

Poecke

 

[Joost Diepenmaat]

document.write ("<" + "script language='JavaScript' type='text/
javascript' src='");

etc...

If you call document.write /while the page is loading/ it will append
whatever is written at that point in the page. If you call
document.write at a later time, it will create a new page to write to.

Your best bet is to translate the banner code to something that either
uses innerHTML or some other DOM methods (document.createElement etc)
that play nice when you execute them after page load.

HTH,
Joost.

 

[poecke]

That makes sense... Although I believe I did try to do that... Tried
again, came up with this:

<script type="text/javascript">
function setInnerHTMLAndExecScript (element, html) {
var newElement = element.cloneNode(false);
newElement.innerHTML = html;
element.parentNode.replaceChild(newElement, element);
}
</script>
<script type="text/javascript">
function doTest () {

if (!document.phpAds_used) document.phpAds_used = ',';
phpAds_random = new String (Math.random()); phpAds_random =
phpAds_random.substring(2,11);
var referrer;
referrer = "";
if (document.referrer){
referrer = "&amp;referer=" + escape(document.referrer);}

html = [
' <script language=\'JavaScript\' type=\'text/javascript\' src=
\'http://ads2.bom-media.nl/adx.js\' defer><\/script>',



'<script language="JavaScript" type="text/javascript" src="http://
ads2.bom-media.nl/adjs.php?n=' + phpAds_random+
'&amp;what=zone:67&amp;exclude=' + document.phpAds_used + referrer
+
' " defer> <\/script>',
' <noscript>',
' <a href=\'http://ads2.bom-media.nl/adclick.php?n=adbb5903\'
target=\'_blank\'><img src=\'http://ads2.bom-media.nl/adview.php?
what=zone:67&amp;n=adbb5903\' border=\'0\' alt=\'\' ><\/a>',
' <\/noscript> '

].join('\r\n');
alert(html);
setInnerHTMLAndExecScript(document.getElementById('banner_midden'),
html);
}

window.onload = doTest;
</script>

(the alert is to see the output of html, which seems right to be what
i want it to be...)

Alas, I'm getting the same error, it's loading on a blank page, for
some reason.
I tried putting the first script src in different places(thought the
script called placed it's code in there or something, also didn't
work...

Firefox is giving me a "FlashObject is not defined" error, while IE7
doesn't seem to do anything at all, except give the alert... (stays on
the page, with a blank spot, and no error notification)


*smashes head against way*

 

[poecke]

*wall

damn, must have smashed too hard...

 

[pr]

That makes sense... Although I believe I did try to do that... Tried
again, came up with this:

<script type="text/javascript">
function setInnerHTMLAndExecScript (element, html) {
var newElement = element.cloneNode(false);
newElement.innerHTML = html;
element.parentNode.replaceChild(newElement, element);
}
</script>

That works for me using a 'hello world' script.

<script type="text/javascript">
function doTest () {

if (!document.phpAds_used) document.phpAds_used = ',';
phpAds_random = new String (Math.random()); phpAds_random =
phpAds_random.substring(2,11);
var referrer;
referrer = "";
if (document.referrer){
referrer = "&amp;referer=" + escape(document.referrer);}

html = [
' <script language=\'JavaScript\' type=\'text/javascript\' src=
\'http://ads2.bom-media.nl/adx.js\' defer><\/script>',

I wouldn't use the defer attribute there.

'<script language="JavaScript" type="text/javascript" src="http://
ads2.bom-media.nl/adjs.php?n=' + phpAds_random+
'&amp;what=zone:67&amp;exclude=' + document.phpAds_used + referrer
+
' " defer> <\/script>',
' <noscript>',
' <a href=\'http://ads2.bom-media.nl/adclick.php?n=adbb5903\'
target=\'_blank\'><img src=\'http://ads2.bom-media.nl/adview.php?
what=zone:67&amp;n=adbb5903\' border=\'0\' alt=\'\' ><\/a>',
' <\/noscript> '

].join('\r\n');
alert(html);
setInnerHTMLAndExecScript(document.getElementById('banner_midden'),
html);
}

window.onload = doTest;
</script>

(the alert is to see the output of html, which seems right to be what
i want it to be...)

Yeah. Looks reasonable.

Alas, I'm getting the same error, it's loading on a blank page, for
some reason.
I tried putting the first script src in different places(thought the
script called placed it's code in there or something, also didn't
work...

It's almost certainly something you haven't posted yet and probably the
advertiser's script reacting badly to its new environment. Did you check
that there aren't any calls to document.write() in
'http://ads2.bom-media.nl/adx.js' or
'http://ads2.bom-media.nl/adjs.php...', for example? If there are, you
can't win, as Joost has pointed out. It would seem the likeliest
explanation for your original error.

Firefox is giving me a "FlashObject is not defined" error, while IE7
doesn't seem to do anything at all, except give the alert... (stays on
the page, with a blank spot, and no error notification)

Nothing you have posted would generate an error of that description. If
you can't supply the URL of a test page, your best bet is Firebug <URL:
https://addons.mozilla.org/en-US/firefox/addon/1843>, so you can examine
the imported scripts in detail.

 

[poecke]

I finally took the trouble of looking in the darned script from my
advertiser, and yes, there is a nasty document.write...

Since that makes it impossible to do it when loaded, is there a way to
call the function just before the page finishes loading? I tried just
calling the function completely at the bottom of the page, but I get
the same thing...


I'm guessing it just isn't possible...

If anyone has a suggestion how to postpone the original script from
writing until later on, I'd appreciate it, but at this moment I can't
be arsed to put more time into it...

Well, at least I learned something more about javascript...

Thanks for the responses.