Delayed SCRIPT Loading

ebrandmark · Feb 11, 2005

I am trying to load a SCRIPT SRC tag that will result in a
document.write into a specific location in my web page but not call for
the SCRIPT SRC until the end of the page (so as not to delay the page).

The DEFER method won't work because the document.write just starts a
new page.

I was hoping to leave a DIV where the result should end up. Then at
the end of the page create a child of this DIV or another DIV that lays
on top of this DIV and place the results in there.

I can't use the innerHTML property of the DIV as it seems that SCRIPT
tags within that innerHTML are not executed and the result may have
SCRIPT tags.

I also can't use an IFRAME (which is the easy solution) for various
reasons.

I have tried to create a child SCRIPT element of the DIV - but the
document.write still writes at the bottom of the screen.

I also (a lot of requirements, I know) need this to be generic (I won't
know ahead of time the x,y location) and want to use this on a lot of
web pages.

So I want something like this:

Content....

Placeholder for SCRIPT SRC

More content

Call for SCRIPT SRC but results go over (in) the Placeholder
End of Page code.

Thanks for any assistance.

Ed Brandmark

RobG · Feb 12, 2005

I am trying to load a SCRIPT SRC tag that will result in a
document.write into a specific location in my web page but not call for
the SCRIPT SRC until the end of the page (so as not to delay the page).

The DEFER method won't work because the document.write just starts a
new page.

Then don't use document.write. Use DOM methods to modify your
page.

I was hoping to leave a DIV where the result should end up. Then at
the end of the page create a child of this DIV or another DIV that lays
on top of this DIV and place the results in there.

Reference your location using document.getElementById or similar.

I can't use the innerHTML property of the DIV as it seems that SCRIPT
tags within that innerHTML are not executed and the result may have
SCRIPT tags.

If you insert a script into a page, it will run as if it was
there when the page was loaded. You can also insert a script
with functions, then call them later.

Here's a sample HTML page:

<html>
<head>
<title>play</title>
<script type="text/javascript">
function addScript(){
var h = document.getElementsByTagName('head')[0];
var s = document.createElement('script');
s.type = 'text/javascript';
s.src = 'play.js'
h.appendChild(s);
}
</script>
</head>
<body>
<button onclick="addScript();">Add script</button>
<button onclick="hiMum();">Hi mum</button>
<br>
<span id="outSpan"></span>
</body>
</html>

Save the following as "play.js" in the same directory:

if (document.getElementById && document.createTextNode){
var tx0 = document.createTextNode('hi mum 0');
document.getElementById('outSpan').appendChild(tx0);
}

function hiMum() {
if (document.getElementById && document.createTextNode){
var o = document.getElementById('outSpan');
o.appendChild(document.createElement('br'));
o.appendChild(document.createTextNode('hi mum 1'));
}
}

Clicking in "Add script" adds the script to the page. When
loaded, it runs and writes "Hi mum 0" to the page. Clicking on
"Hi mum" will added "Hi mum 1" to the page. Clicking on "Hi mum"
before then does nothing (or generates an error).

Issue with textbox script?	0	Sep 5, 2022
Only one table shows up with the information	2	Mar 29, 2023
Help with code	0	Jun 12, 2022
Clickable Div Block	1	Oct 13, 2023
Help With a Script	5	Jul 10, 2021
Survey details won't go through using php, ajax, Mysql	0	Oct 26, 2023
Why is updating in DELETE trigger delayed when fetching user?	1	Mar 25, 2023
Jquery not triggering / acting as expected.	0	Mar 6, 2022

Delayed SCRIPT Loading

ebrandmark

RobG

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads