window.onload and extern js

A

Andrew Poulos

In the head of my page I have:

<script type="text/javascript" src="scripts/test.js"></script>

and later in the head I have:

<script type="text/javascript">
window.onload = function() {
foo = 1;
};
</script>

If 'foo' is declared in test.js as
var foo = 0;

Will foo equal 1 when the page has finished loading? Or is the loading
of external javascript independent of when a page is counted as having
been loaded?

I'm going to be doing some DOM manipulation in the onload function so
I'm worried that if I instead trigger a function in the page from
test.js the function (in the page) might be ready but the page may not.


Andrew Poulos
 
L

-Lost

Andrew Poulos said:
In the head of my page I have:

<script type="text/javascript" src="scripts/test.js"></script>

and later in the head I have:

<script type="text/javascript">
window.onload = function() {
foo = 1;
};
</script>

If 'foo' is declared in test.js as
var foo = 0;

Will foo equal 1 when the page has finished loading? Or is the loading of external
javascript independent of when a page is counted as having been loaded?

I am unsure of the correct way in which to word this, hopefully someone else can
illuminate more clearly, but...

foo will still be 0 as the DOM is loaded, and then it appears external scripts are looked
at afterwards.

-Lost
 
U

Une Bévue

-Lost said:
foo will still be 0 as the DOM is loaded, and then it appears external
scripts are looked at afterwards.

i don't agree with u, javascript being executed from top to bottom of
the page see the following test :

--- index.html ---
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>script exec</title>
<meta http-equiv="Content-type" content="text/html;
charset=iso-8859-1">
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript">
window.onload = function() {
foo = 1;
document.getElementById(' foo').innerHTML=" foo = " + foo;
};
</script>
</head>
<body bgcolor="#FFFFFF">
<h1>script exec</h1>
<h3 id="foo"></h3>
</body>
</html>
------------------

--- script.js ---
var foo=-1;
-----------------

Tested with Firefox 2.0.0.3 i got :

script exec
foo = 1

;-)
 
A

ASM

Andrew Poulos a écrit :
In the head of my page I have:

<script type="text/javascript" src="scripts/test.js"></script>

and later in the head I have:

<script type="text/javascript">
window.onload = function() {
foo = 1;
};
</script>

If 'foo' is declared in test.js as
var foo = 0;

Will foo equal 1 when the page has finished loading?

Did you try it ?

I would say : yes
and the onload hasn't to be in a special script in the page
Or is the loading
of external javascript independent of when a page is counted as having
been loaded?

the external JS is loaded as soon as it is called
exactly as if it was scripted directly in the page at this place

when 2nd script tells foo = 1; on this moment foo changes from 0 to 1
I'm going to be doing some DOM manipulation in the onload function so
I'm worried that if I instead trigger a function in the page from
test.js the function (in the page) might be ready but the page may not.

best could be to add in your external JS what is necessary to start/fire
your manipulation function.

onload = function() {
foo++; // not more needed
domManipulator();
}
 
R

Robin

Andrew said:
In the head of my page I have:

<script type="text/javascript" src="scripts/test.js"></script>

and later in the head I have:

<script type="text/javascript">
window.onload = function() {
foo = 1;
};
</script>

If 'foo' is declared in test.js as
var foo = 0;

Will foo equal 1 when the page has finished loading? Or is the loading
of external javascript independent of when a page is counted as having
been loaded?

I'm going to be doing some DOM manipulation in the onload function so
I'm worried that if I instead trigger a function in the page from
test.js the function (in the page) might be ready but the page may not.


Andrew Poulos

Only Firefox loads external javascript files asynchronously but from
what I've read the onload event only fires after these have finished
loading (and assumably executing).

I you have server side scripting then you could test by forcing the
delayed response on the javascript:

in the html file use:
<script type="text/javascript" src="scripts/test.js.php"></script>

with test.js.php:
<?php
// stop caching
header("Cache-Control: no-cache, must-revalidate");
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header('Content-type: text/javascript');
// wait 20 seconds
sleep(20);
// output true js file
readfile('test.js');
?>

Robin
 
L

-Lost

"Une Bévue" said:
i don't agree with u, javascript being executed from top to bottom of
the page see the following test :

--- index.html ---
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>script exec</title>
<meta http-equiv="Content-type" content="text/html;
charset=iso-8859-1">
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript">
window.onload = function() {
foo = 1;
document.getElementById(' foo').innerHTML=" foo = " + foo;
};
</script>
</head>
<body bgcolor="#FFFFFF">
<h1>script exec</h1>
<h3 id="foo"></h3>
</body>
</html>
------------------

--- script.js ---
var foo=-1;
-----------------

Tested with Firefox 2.0.0.3 i got :

script exec
foo = 1

I tried the same thing:

<html>
<script src="loadjs.js" type="text/javascript"></script>
<script type="text/javascript">
// <![CDATA[
window.onload = function()
{
foo = 123;
}
// ]]>
</script>
<script type="text/javascript">
// <![CDATA[
alert(foo);
// ]]>
</script>
</html>

I still get "0." However, if I place the alert() after foo = 123; (and leave the other),
I get 0 then 123.

-Lost
 
A

ASM

-Lost a écrit :
I still get "0." However, if I place the alert() after foo = 123; (and leave the other),
I get 0 then 123.

-Lost


To be a twisted reasoning it is a twisted reasoning.

I understand why your name is 'Lost' !

I france we say : "With of the if, Paris could be put in bottle"
 
T

Tom Cole

i don't agree with u, javascript being executed from top to bottom of
the page see the following test :
--- index.html ---
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>script exec</title>
<meta http-equiv="Content-type" content="text/html;
charset=iso-8859-1">
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript">
window.onload = function() {
foo = 1;
document.getElementById(' foo').innerHTML=" foo = " + foo;
};
</script>
</head>
<body bgcolor="#FFFFFF">
<h1>script exec</h1>
<h3 id="foo"></h3>
</body>
</html>
------------------
--- script.js ---
var foo=-1;
-----------------
Tested with Firefox 2.0.0.3 i got :
script exec
foo = 1

I tried the same thing:

<html>
<script src="loadjs.js" type="text/javascript"></script>
<script type="text/javascript">
// <![CDATA[
window.onload = function()
{
foo = 123;}

// ]]>
</script>
<script type="text/javascript">
// <![CDATA[
alert(foo);
// ]]>
</script>
</html>

I still get "0." However, if I place the alert() after foo = 123; (andleave the other),
I get 0 then 123.

-Lost- Hide quoted text -

- Show quoted text -

The first alert(foo) is executed as it is found on the page which in
this case is before the onload has fired because the entire page has
not yet loaded... :) The second alert gets fired after the assignment
(obviously) which is also after onload has been called (obviously,
since it's in the onload event) which then displays the updated value
of 123 (obviously).

It's just a timing thing.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,770
Messages
2,569,584
Members
45,077
Latest member
SangMoor21

Latest Threads

Top