I have a scenario where I want a web page to contain a <link> to one Javascript resource, and have that resource load two other Javascript resources from the same webserver. Is this possible? Can it be done in a browser-independent fashion?

This may sound a bit unusual, but there are plicated reasons why I'd like to be able to do this, and why bining the resources into a single file is ... awkward.

I have a scenario where I want a web page to contain a <link> to one Javascript resource, and have that resource load two other Javascript resources from the same webserver. Is this possible? Can it be done in a browser-independent fashion?

This may sound a bit unusual, but there are plicated reasons why I'd like to be able to do this, and why bining the resources into a single file is ... awkward.

• javascript
• load

• may be putting all in one file is plex , but why not having three script tags ? – GoodSp33d Commented Oct 4, 2010 at 9:57
• The link is in an HTML file that I don't want to modify ... if I can avoid it. (The site is posed using Maven WAR file overlays, and I don't "own" the module that contributes the HTML file. I can copy the file and modify it, but then I've got a problem tracking changes made to the original version.) – Stephen C Commented Oct 4, 2010 at 10:02

2 Answers 2

If I'm not wrong Javascript resource is nothing but your *.js files, Right? So You can include any number of js in your page, with <script> tag. e.g.

<script type="text/javascript" src="MyDomain/js/abc.js"></script>
<script type="text/javascript" src="MyDomain/js/xyz.js"></script>

Also, in one js file, you can import another js file, by calling following function:

function IncludeJavaScript(jsFile)
{
  document.write('<script type="text/javascript" src="'
    + jsFile + '"></scr' + 'ipt>'); 
}

EDIT:

Or another way to write same function:

function includeJS( jsPath )
{
    var js = document.createElement("script");
    js.setAttribute("type", "text/javascript");
    js.setAttribute("src", jsPath);
    document.getElementsByTagName("head")[0].appendChild(js);
};

Call these functions inside you js file.

It appears what you're looking for is typically referred to as On-Demand javascript