<TAG>Simple HTML& Javascripting Tricks & Tips

 

JavaScript: External JavaScripting(*.js files)

Jack Donnell,
[email protected]





RELOAD THE PAGE! The top headline should have changed. Cool trick huh?

Using external javascript files are great. You code them once. Check them then transplant them to any page by adding the   SRC="./external file.js" to your <script language="Javascript"></script> tags. We use it extensively for the Date Stamp( ) on our pages.  We know the code will not change and makes it easier putting it into multiple pages.  Also, we will use it to change content on a page randomly or date based. Neat trick and gives your visitors fresh content.  Another advantage is that your code will not be visible to folks that right click and view source on your pages. (WARNING - DON'T think that this is totally fool proof.. Somebody can capture your code.. Don't rely on this as being totally secure.)

It does have some downfalls. You need to limit to a single purpose like writing a text link or image banner to a page, etc.  Another consideration is that it requires your browser to make another call to the server to get the *.js file which can increase your your page load time.

The above example calls a file topstory.js from the server. This example writes text and text links to the page, but you can have it do most anything. Just remember only one function and keep your arrays to one line each. Here is another example link Dynamic.



USER QUESTION: HOW DO YOU USE QUOTES IN THE ARRAY FOR IMAGES, ETC?
The easy way is to leave them out as these image.js and the imag1.js
files are called by the test.htm file shows.


 

SOURCE FOR EXTERNALSCRIPT.HTM (calls the external *.JS javascript file)

<html>

<head>

<title>Test External JavaScript</title>

</head>

<body>

<p align="center"><big><big><big><big><big><strong>TEST SCRIPTS</strong></big></big></big></big></big></p>

<p align="center"><br>

<br>

<br>

<script SRC="topstory.js"></script> <br>

<br>

</p>

</html>

</head>

 

SOURCE FOR TOPSTORY.JS - -WARNING-- Each ARRAY var has to be on a single line.


 

var quote = new Array(10);

quote[0] = "<FONT face=ARIAL size=6 color=green><B>ONE RANDOM QUOTE</B></FONT>";

quote[1] = "<FONT face=ARIAL size=6 color=green><B>TWO RANDOM QUOTE</B></FONT>";

quote[2] = "<FONT face=ARIAL size=6 color=green><B>THREE RANDOM QUOTE</B></FONT>";

quote[3] = "<FONT face=ARIAL size=6 color=green><B>FOUR RANDOM QUOTE</B></FONT>";

quote[4] = "<FONT face=ARIAL size=6 color=green><B>FIVE RANDOM QUOTE</B></FONT>";

quote[5] = "<FONT face=ARIAL size=6 color=green><B>SIX RANDOM QUOTE</B></FONT>";

quote[6] = "<FONT face=ARIAL size=6 color=green><B>SEVEN RANDOM QUOTE</B></FONT>";

quote[7] = "<FONT face=ARIAL size=6 color=green><B>EIGHT RANDOM QUOTE</B></FONT>";

quote[8] = "<FONT face=ARIAL size=6 color=green><B>NINE RANDOM QUOTE</B></FONT>";

quote[9] = "<FONT face=ARIAL size=6 color=green><B>TEN RANDOM QUOTE</B></FONT>";

now=new Date()

num=(now.getSeconds())%9

document.write(quote[num])