Use wildcard in src attribute of <script> tag?

Question

Ok, silly question, and I don't think it is possible, but I have this markup at the top of my .aspx page ...

<%--Third Party Libraries, Plugins, Extensions --%> <script src="Libraries/Raphael/Raphael.js" type="text/javascript"></script> <script src="AutoComplete/jquery.autocomplete.js" type="text/javascript"></script> <script src="Libraries/jQuery/1.4.2/jquery.js" type="text/javascript"></script> <script src="Libraries/jQuery/UI/1.8.4/jquery.ui.core.js" type="text/javascript"></script> <script src="Libraries/jQuery/UI/1.8.4/jquery.ui.widget.js" type="text/javascript"></script> <script src="Libraries/jQuery/UI/1.8.4/jquery.ui.mouse.js" type="text/javascript"></script> <script src="Libraries/jQuery/UI/1.8.4/jquery.ui.draggable.js" type="text/javascript"></script> <script src="Libraries/jQuery/UI/1.8.4/jquery.ui.droppable.js" type="text/javascript"></script> 

It would be nice if I could replace this with ...

 <%--Third Party Libraries, Plugins, Extensions --%> <script src="Libraries/Raphael/Raphael.js" type="text/javascript"></script> <script src="AutoComplete/jquery.autocomplete.js" type="text/javascript"></script> <script src="Libraries/jQuery/1.4.2/jquery.js" type="text/javascript"></script> <script src="Libraries/jQuery/UI/1.8.4/jquery.ui.*.js" type="text/javascript"></script> 

those. use * as a wildcard.

Obviously, since this is JS, I can just throw all these scripts into one big script and load it, but I really don't like it.

Does anyone have a technique for mass cleaning script refs? Or are we just living with this?

Answer 1

As far as I know, this is impossible, simply because the browser will need to know exactly which files to request.

The browser, in fact, will have to redirect the server to requests, hoping to get happiness.

I would suggest using the Google closure compiler to merge all similar, if not all, javascript files into a single file. It will be a little big, but will shorten the HTTP request.

With some profiling, you can find a balance between which files are most often needed and speed.

UPDATE (from comments)

I am generally reluctant to propose adding a new javascript library to solve the problem of too many javascript libraries :) Plus it just seemed to be a more direct solution. We are currently using the Google closure API to compress and combine all of our javascript and CSS and build time using ANT. Works in charm. It can also be done to some extent directly using apache2 virtual host / htaccess (see Html5boilerplate.com) for examples and limitations

Answer 2

No, not the way you think. You can do something similar if you use JavaScript loaders (e.g. RequireJS or LabJS ), since you can condense each file into an array and scroll through them, or if you feel ambitious, prepare some protocol between the front and back ends, to support this.

However, this is not recommended as it is not easy to maintain. If your problem with combining files into one of them is related to this effort, then JS minifiers (for example, UglifyJS or Closure Compiler ) can solve your problem.

Answer 3

In fact, as someone else might have mentioned, you could add your own script file there and do something like add paths to the array, iterate through getScript for each element.

 $.getScript('ajax/test.js', function() { alert('Load was performed.'); }); 

Answer 4

those. use the * character as a wildcard.

Not. Well, if you do not want your server to pass a URL that contains the * character through a script that resolves it and combines all of JS on the fly.

Obviously, since this is JS, I can just throw all these scripts into one big script and load it, but I really don't like it.

This is a good decision. Typically, you would like to do this as part of the script assembly for the site and at the same time call the minifier call.

Answer 5

I would omit type="text/javascript"

The type attribute is required in HTML 4 , but not necessarily in HTML5 .

But I still think src merging is not possible (with HTML5 and CSS3)

Answer 6

You can simply copy the contents of all jquery.ui files. * into one file. As an added bonus, your pages will load a little faster.