This week's book giveaway is in the Jobs Discussion forum.
We're giving away four copies of Soft Skills: The software developer's life manual and have John Sonmez on-line!
See this thread for details.
Win a copy of Soft Skills: The software developer's life manual this week in the Jobs Discussion forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

how to include several .js files

 
Karen Nelson
Ranch Hand
Posts: 57
  • 0
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi again,
I have 4 external js files, and I'll probably eventually have more. I would like to list the external files in one metafile, then include that metafile on each page of my website. Is that possible? If I write a .js file with a bunch of <script src="whatever.js"> statements, I just get an error message.

If I could also put the css files in this metafile, that would be fantastic...
-Karen.
[ August 16, 2006: Message edited by: Karen Nelson ]
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64171
83
IntelliJ IDE Java jQuery Mac Mac OS X
  • 0
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Sorry, not with pure HTML.
 
Roy Ivar Moe
Greenhorn
Posts: 21
  • 0
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi,

I guess you could include one .js file, and then dynamically insert the rest of the script tags from this file using the DOM.

Regards,
Roy
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64171
83
IntelliJ IDE Java jQuery Mac Mac OS X
  • 0
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Originally posted by Roy Ivar Moe:

I guess you could include one .js file, and then dynamically insert the rest of the script tags from this file using the DOM.


Yes, this is a technique that some 3rd party libraries (Scriptaculous comes to mind) use.

It's a bit tricky as there are some cross-browser issues, so if using a server-side language (like JSP) I'd recommend using a custom action for something like this.

If not, then dynamic inclusion using just JavaScript is a possibility, if a bit trickier.
[ August 16, 2006: Message edited by: Bear Bibeault ]
 
Karen Nelson
Ranch Hand
Posts: 57
  • 0
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
The tricky part is getting over my head again. I tried calling this function from window.onload



but the code in knGraph.js is not accessible. I'm guessing this is because the page has already loaded so the js file never gets read. But I can't add any nodes with DOM scripting until after the page has loaded, right? So how do I do this?

Thank you again!
 
Roy Ivar Moe
Greenhorn
Posts: 21
  • 0
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
It sounds like some kind of timing issue.

Are you sure that your external js files have finished loading when you try to access them? Sounds like you need some kind of callback to tell you that the dynamically inserted scripts are loaded.

One way, I guess, would be to set a flag in the main js file, to indicate that the dynamically inserted file has loaded. Then in the main js file you could have a periodical timer that checks the flags before your js logic is kicked off.


By loading js files this way, you might get a problem with users being able to interact with your page (after onload), without your js logic being completely loaded, or not?

I've never tried dynamically inserting scripts this way (only with JSON), so I don't know exactly how they do it. Maybe you can look into the scriptaculous library, or Dojo, and see how they achieve it.


Regards,
Roy
[ August 17, 2006: Message edited by: Roy Ivar Moe ]
 
Eric Pascarello
author
Rancher
Posts: 15385
6
  • 0
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Add an alert statement into your js file and see if it appears. Good way to debug that.

Before you call any of the functions in the js folder you may want to do something like:



Eric
 
Rusty Smythe
Ranch Hand
Posts: 93
Mac Objective C Ruby
  • 0
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Originally posted by Karen Nelson:
I would like to list the external files in one metafile, then include that metafile on each page of my website.


Can you tell us why you want to do this?

If it is for managability (i.e., updating many pages at once with a new js), then there are easy ways to accomplish this without resorting to some js hack that may or may not work on every browser.

XSLT
Create template(s) in XSLT, page content in XML. When you need to add more js files, just update the XSLT file(s) and re-merge

PERL/SED/AWK
Run a script to add a new js include to all your pages.

KISS
Whenever you need to add new functionality, extend the existing js files instead of creating new ones. You can organize your JS functions into logical units and then place them in appropriate JS files.

For example:
- formFunctions.js
- ajaxFunctions.js
- layoutFunctions.js
- verificationFunctions.js
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic