 | JavaScript | |||
|---|---|---|---|---|
| Prev | Home | Up | Next |
The <SCRIPT> tag is how the JavaScript code is embedded into a web page. There are several ways to do this. Note that the <SCRIPT> tag must have an associated closing </SCRIPT> tag at the end of the script source text. The following attributes may be useful:
LANGUAGE
SRC
ARCHIVE
TYPE
You can place the <SCRIPT> tag in the <HEAD> or <BODY> section of the page.
In the <HEAD> context, it is expected to provide some support to the rest of the page so you might place useful functions and event handlers here. You can also put some global code here and it will get executed inline, probably initializing some global variables. The intent is for the <HEAD> block to contain only meta-information about the document. This implies you should not place a document.write() method into the <HEAD> area such that it will be executed during page loading. However, both the Netscape and MSIE browsers will allow the document.write() if it is called during page loading even if it is located in the <HEAD> block.
It makes some sense to be sure that if you do a document.write() in the <HEAD> block, that you make sure it writes something sensible. For example, you can write the document title from a script that is executed inline. If you just write some textual output, the browsers are at least smart enough to place it into the page body.
Because JavaScript is interpreted, it needs to have any functions declared before they are called. However, this means they must be declared chronologically before they are called. This is not the same as positionally defining them before they are called because the page content may be traversed several times. For example, an event handler can probably be placed anywhere because very few events happen before the </BODY> closure happens. Nevertheless, it is still probably good practice to locate any functions that you can in <SCRIPT> blocks placed in the <HEAD> area.
You can place <SCRIPT> tags throughout the <BODY> of the document. These might also contain functions but are more likely to contain inline code to be executed as the page is loading. Although they are in different <SCRIPT> tag blocks, they are all conceptually part of the same script.
If your inline script code is going to do any document.write() calls to modify the HTML as the page is loaded, then this is the optimum place to put the code. It's quite sensible to break the code into smaller <SCRIPT> blocks and place them appropriately throughout the document. If the code starts to become complicated, then factor some of it into functions placed in the <HEAD> area and then call it as needed from the <BODY> area.
If you are using a frame-set, you can put the <SCRIPT> block after the <HEAD> tag but before the <FRAMESET> tag. You could write the entire <FRAMESET> description at this point using document.write() methods. You could do that with the entire <BODY> content too.
You can break your script code into smaller blocks, each one associated with a different <SCRIPT></SCRIPT> area and, if necessary, each can be executed in a different version of JavaScript. They will each have a different execution context and the scope chain may be affected, although global variables should be reachable from anywhere.
When the browser encounters a <SCRIPT> tag, it pauses the processing of the HTML page description and executes the <SCRIPT> tag's source code. That may affect subsequent HTML output anyway, and may generate some HTML to be placed into the page at the point where the <SCRIPT> block appears. Any lengthy script evaluation is going to slow down the display of your page. You should defer any lengthy processing until you can use some sleight of hand to hide it. For example, perhaps you can wait until the <BODY> tag is closed and then activate some processing with a <BODY ONLOAD="..."> handler. This may be an issue if you are using included .js files since they will need to be requested and fetched from a web server.
You can build event handlers and associate them with the event by means of the <SCRIPT> tag attributes, but this only works in MSIE.
Be aware that if you place <SCRIPT> blocks inside the <HEAD> of a document, you may be able to initialize some data structures but you certainly won't be able to access any objects that belong to the <BODY> since they won't yet exist.
Note that during page loading, until you have reached the closing </BODY> tag, the page may be in some intermediate state where objects and memory locations are not locked down. This may cause some difficulties in writing to the document or changing the content of <DIV> blocks. In particular, you cannot inline document.write() into the content of an <OBJECT> block. Until the page is completed, the <OBJECT> is not properly linked into a structure in which you can access it from JavaScript, this is the case with MSIE version 4 browsers, at least.
<HTML>
<HEAD>
</HEAD>
<BODY>
<SCRIPT>
myResult = 100;
myExpr = myResult %= 1000;
document.write(myResult);
document.write("<BR>");
document.write(myExpr);
document.write("<BR>");
</SCRIPT>
</BODY>
</HTML>| Prev | Home | Next |
| <SCRIPT LANGUAGE="..."> | Up | ScriptArray object |
JavaScript Programmer's Reference, Cliff Wootton Wrox Press (www.wrox.com) Join the Wrox JavaScript forum at p2p.wrox.com Please report problems to support@wrox.com © 2001 Wrox Press. All Rights Reserved. Terms and conditions. | ||