0

In html page, I'm include js

<script src="/script/lib.js?file=bootstrap,jquery"></script>

And in lib.js, I can include like this:

if(file=="jquery"){
   $.getScript("//cdn.optimizely.com/js/jquery.js");
}
if(file=="ecomotion"){
  $.getScript("//cdn.jsdelivr.net/emojione/1.3.0/lib/js/emojione.min.js");
}
if(file=="bootstrap"){
   $.getScript("//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js");
}
ect

How can we do that?

dev.rocket
  • 175
  • 2
  • 9
  • 3
    You can't pass parameters to scripts, like that. – Cerbrus Jul 06 '15 at 10:25
  • Just to confirm, you want to include a JS file that then looks at the GET parameters of that and conditionally includes other scripts? So your question is really how to read the GET parameters of a JS file included using a `script` tag? – Kevin Nagurski Jul 06 '15 at 10:26
  • @RoryMcCrossan: Dangit, I was just about to answer with an alternative _*sadface*_ – Cerbrus Jul 06 '15 at 10:28
  • Feel free to re-open if you have a working solution that's missing in the other question. – Rory McCrossan Jul 06 '15 at 10:28
  • http://stackoverflow.com/questions/4493319/in-javascript-is-it-possible-to-pass-a-variable-into-script-src-parameter/4494258#4494258 – pawel Jul 06 '15 at 10:31
  • @Kevin Nagurski yes, that right – dev.rocket Jul 06 '15 at 10:32
  • @Juhana: No, that's not the same, that's query string values in the ___page___'s url, not in the JS file's src. Guys, query stings are ___not___ the way to pass variables to JS files. Don't suggest hacks to make it work. Suggest a decent alternative instead. – Cerbrus Jul 06 '15 at 10:34
  • One thing to remember is that you're using `$.getScript` which is a jQuery function, so you'll need to get jQuery on the page regardless to make `lib.js` work at all. – Kevin Nagurski Jul 06 '15 at 11:31
  • @Juhana This is not my mine, so this is not duplicate, please read again. – dev.rocket Jul 07 '15 at 02:18

2 Answers2

0

You can't pass parameters to JavaScript files, like that.

You could, however, do this:

<script>
    window.file = ['bootstrap', 'jquery'];
</script>
<script src="/script/lib.js"></script>

In your script:

if(window.file.indexOf("bootstrap") !== -1){
// Same for the other file types.

The disadvantage here is that you're creating a global variable, which is arguably a bad idea.

The advantage is that you can easily specify a list of files to include, while working around the fact that it's impossible to pass query strings to a JS file.

Cerbrus
  • 70,800
  • 18
  • 132
  • 147
0

OPTION 1

The only way that you can really do this like you have written is if lib.js was interpreted on the server side. For instance in PHP (or Node, or .Net) you could then read the GET and spit out the appropriate $.getScript blocks as output.

Pros are that it'll work without any weird hacks. You could even work to make the file cache-able.

A simple .htaccess mod-rewrite can direct calls to libs.js to a PHP script.

OPTION 2

Another option would be to expose a function from libs.js that would initialise the includes:

libs.js

function getMyScripts(scripts){
    /* loop through the `scripts` array and spit out
       the `$.getScript` calls */
}

You page would then do this:

<script src="libs.js"></script>
<script>
    getMyScripts(['lib1', 'lib2']);
</script>
Kevin Nagurski
  • 1,889
  • 11
  • 24
  • But if it's processed server-side, what would be the point in using `$.getScript`? Just serve the requested scripts instead. – Cerbrus Jul 06 '15 at 11:19
  • @Cerbrus true, but he's loading the scripts from a public CDN, not from his own application, so the point would be to kick things off. – Kevin Nagurski Jul 06 '15 at 11:20