Trouble Including an External .js file

**Alice Moore** · 07-13-2010, 11:08 PM

Hello. I'm a JavaScript newbie, just trying to teach myself so I can build a website. I have several years experience as a C++ / C# Windows developer, but very little web experience beyond a little tinkering with html and css.

My problem: For some reason I can't manage to include a .js file and access what's in it...

I've tried using a relative path and an absolute path and neither seem to work. When I embed the code in the actual html file, it works just fine. But I'd really like to have reusable code and not have to duplicate it everywhere.

Let's say I want to output "Hello world". Actually I want to do something more complicated, but as part of debugging I tried to simplify it so I could identify the problem.

In the <head> section of my html file I have the following:

Code:

<script language="JavaScript" type="text/javascript" src="http://claresudbery.co.uk/Pictures/DYWPics/DYW_Java3.js"></script>

...and the file DYW_Java3.js definitely exists at the location specified above. And it contains the following:

Code:

<script language="JavaScript" type="text/javascript">
<!--
document.write("<i>Hello World!</i>");
//-->
</script>

...and the Hello World message never appears on the page (which, if you want to look at it, is here: http://claresudbery.co.uk/Pictures/D...dex_Java1.html).

But if I place the following simple line:

Code:

document.write("<i>Hello World!</i>");

...in the html file, just under the .js include statement, I get a Hello World.

I found this thread here via Google, and tried the advice given there, but it didn't work.

Help! I'd really like to be able to successfully include js files!

**jscheuer1** · 07-14-2010, 05:59 AM

You shouldn't have any of the highlighted in the external DYW_Java3.js file:

Code:

<script language="JavaScript" type="text/javascript">
<!--
document.write("<i>Hello World!</i>");
//-->
</script>

Some of it's OK, but performs no useful purpose. The rest (except for the part not highlighted) will stop the script from executing.

Just getting rid of that stuff should get it working.

You should also probably get out of the habit of using Java to connote javascript. Java is a separate language. There's nothing wrong with the way you have used the word in your filenames, but it can lead to confusion and in some situations (especially other than in filenames, though perhaps in some cases there too) might cause an error.

Your external script tag should be like so:

Code:

<script type="text/javascript" src="http://claresudbery.co.uk/Pictures/DYWPics/DYW_Java3.js"></script>

as the language attribute has been deprecated. It's still valid in some DTD's, but does cause problems sometimes even in those.

Here are my guidelines:

Use a text editor to save the script, call it 'file_name.js' where 'file_name' can be any valid file name of your choosing. Substitute the name of your external .js file for some.js in the below:

HTML Code:

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

Common problems arise when:

1 ) The script file is not in the directory specified. In the above example it must be in the same directory as the page(s) that use it. Below, it can be in the scripts directory off of the root of a domain:

HTML Code:

<script src="http://www.somedomain.com/scripts/some.js" type="text/javascript"></script>

2 ) Opening, closing and/or 'hiding' tags are left in the external file. This means that you must strip:

Code:

<script>
<!--

and

Code:

//-->
</script>

and any of their many variations from the beginning and end of the external file.

3 ) The external call (<script src="some.js" type="text/javascript"></script>) is not inserted into the page at the correct spot. The external call must be inserted at the same place on the page where the script was/would have been.

4 ) Paths to other files (if) used by the script are no longer valid due to its location. This is only a problem if the external script is kept in a different directory than the page it was working on when it was an internal script. To correct this, use absolute paths inside the script. Absolute path examples:

Code:

http://www.somedomain.com/images/button.gif

http://www.somedomain.com/~mysitename/index.html

5 ) Inappropriately combining two or more scripts into one external file. Usually external scripts can be combined if one knows enough about scripting to do so properly. Even then it is possible to overlook something.

A rule of thumb when testing is, if it won't work on the page, it won't work as an external file either.

One other thing, if this is a DD script or any script that requires the credit remain for legal use, include the credit in the on page call, ex (see usage terms for more info on this, especially item 4 from the terms):

HTML Code:

<script src="some.js" type="text/javascript">
/***********************************************
* IFrame SSI script II- © Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
* Visit DynamicDrive.com for hundreds of original DHTML scripts
* This notice must stay intact for legal use
***********************************************/
</script>

Make sure to retain all the 'decorations', as these include begin and end javascript comment delimiters, without which the script won't function.

There is also info here:

http://www.javascriptkit.com/javatutors/external.shtml

**Alice Moore** · 07-14-2010, 08:28 AM

This is brilliant, thank you so much.

Thread: Trouble Including an External .js file

Thread Tools

Search Thread

Trouble Including an External .js file

Bookmarks

Bookmarks

Posting Permissions