views:

38

answers:

2

Hi. Is it possible to load js scripts like this with commas separating the scripts:

<script src="/js/enhance.js,enhance.config.js" type="text/javascript"></script>

I am using the Filament Groups progressive enhancement javascript library 'EnhanceJS' and I am trying learn from their website www.filamentgroup.com where this technique is used to great effect, another example:

<script src="/js/jquery.js,jquery.plugins.js,common.js" type="text/javascript"></script>

When I try to do the same and look in firebug the above code is there but on closer inspection I get an error saying 'the requested URL /js/jquery.js,jquery.plugins.js,common.js could not be found on this server.

Progressive Enhancement is very new to me and I am not sure if I need my server set in a particular way to handle this method of loading Javascript.

EDIT:

In the JS file that is loaded they have a config file that loads the rest of the scripts like this:

/* Copyright Filamentgroup.com: EnhanceJS configuration for screen/mobile enhancements */
//common script dependencies
var baseScripts = '/js/jquery.js,jquery.plugins.js,common.js';

//check for mediaq support, base screen type on it
var screenMedia = enhance.query('screen and (max-device-width: 1024px)') ? 'screen and (device-min-width: 5000px)' : 'screen',
handheldMedia = 'screen and (max-device-width: 1024px)';

//call enhance() function, include relevant assets for capable browsers
enhance({
loadStyles: [
    {media: screenMedia, href: '/css/screen.css'},
    {media: handheldMedia, href: '/css/handheld.css'}
],
loadScripts: [
    'http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js',
    {media: screenMedia, src: baseScripts+',screen.js'},
    {media: handheldMedia, src: baseScripts+',handheld.js'}
],
forcePassText: 'Enhanced version',
forceFailText: 'Basic version'  
}); 
+1  A: 

This is probably concatenating the files on the server on-demand, using something like mod_concat.

Joeri Sebrechts
A: 

I posted this as a comment earlier, but I'll post it as an answer since it seems fitting.

The HTML <script> element does not support including multiple scripts in one element. The reason it works on their website is because they have a JavaScript file that is literally called enhance.js,enhance.config.js, and similar for all the rest of the scripts they use. I am guessing these files are generated on the server-side, or created behind-the-scenes using some sort of compiler.

None of this is being done on the client-side, so you can stop looking for a JavaScript solution to this. Just load the scripts as you normally would, one-by-one.

musicfreak