3

I want to load a JS and his behaviour should differ depending of one parameter. I thought one of the ways to do this could be:

<script src="script.js?type=a" type="text/javascript"></script>
<script src="script.js?type=b" type="text/javascript"></script>
...

Then, I would obtain the parameter using regex, like:

function getURLParameter(name) {
    return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null;
}

(above function from here).

However, I'm not sure if this is the best approach for this. Do you suggest any other way to do this, like, loading global variables inside the <script></script> and then read them from the JS?

Community
  • 1
  • 1
Jonhas
  • 125
  • 1
  • 1
  • 9
  • behave differently how? Is it possible for the parameter to change the output of the js file? Also does it make sense that the parameter could change multiple times? – awbergs Mar 05 '13 at 16:17
  • I don't see anything in your question related to regex other than tangentially in your source code. – JDB Mar 05 '13 at 16:19
  • I think that is enough to put the tag in my question? If it is not, feel free to remove it (you or any moderator). – Jonhas Mar 05 '13 at 16:20

4 Answers4

5

There may be a better way to organize your code in general, but an easier way to configure a parameter than a URL query would be to simply call the defined functions with an argument:

External script (foo.js):

function foo(param) {
    console.log(param);
}

HTML:

<script src="foo.js"></script>
<script>foo("parameter value");</script>

Edit: Here's an example of "configuring" a parameter without immediately calling anything (basically, a simple closure):

function (param) {
    $(document).ready(function () {
        // Use param
    });
}

$(document).ready is already an async call so this is simpler than it might be otherwise, but in general you can use an IIFE (Immediately Invoked Function Expression): (function (param) { })(paramValue)

jonvuri
  • 5,738
  • 3
  • 24
  • 32
  • I forgot to say (sorry) that my script is $(document).ready based, so it's not the solution I was looking for but I know what you mean, thank you though. – Jonhas Mar 05 '13 at 16:17
  • You can still do it fairly easily. I'll amend my answer with an example. – jonvuri Mar 05 '13 at 16:18
  • I think this is the smartest way to do what you're asking without knowing much more about your specific rules. Url param would be a hacky way to achieve what this solution is doing. Plus you have the added bonus of being explicit in your intent. – awbergs Mar 05 '13 at 16:22
  • I think I'm following this approach to do what I want to do. It seems clean and won't cause any issue in the future at first glance imho. Thank you for your help! – Jonhas Mar 05 '13 at 16:25
1

The getURLParameter function you have given will use the URL that you see in the address bar, not the one the <script> was loaded with.

To get that, you will need to replace location.search with

Array.prototype.pop.call(document.getElementsByTagName('script')).getAttribute("src");
Niet the Dark Absol
  • 320,036
  • 81
  • 464
  • 592
  • You're right - I didn't pay too much attention to the example, it was just to illustrate what I meant, but I'm not using it actually. Thanks for pointing it out. – Jonhas Mar 05 '13 at 16:23
0

I would just set a global variable before getting the external script, then use it inside:

<script>var someParameter = 'a';</script>
<script src="script.js"></script>
Alan Shortis
  • 1,277
  • 3
  • 18
  • 35
  • This looks like a maintenance nightmare. – JDB Mar 05 '13 at 16:16
  • I would not do this. Magic global variables are a headache. – awbergs Mar 05 '13 at 16:18
  • I thought about this as I mentioned, but I think it's not the most elegant solution and, as said above, kind of a nightmare to maintain? – Jonhas Mar 05 '13 at 16:18
  • 1
    Fair enough - I suppose it depends on how complex your parameters are going to be and how often you will use them. I only made this suggestion as I had done a little research into parameters before and found this to be the best way in that case. – Alan Shortis Mar 05 '13 at 16:21
0

You can make your javascript in php and use

var parameters = <?php echo json_encode($_GET); ?>
function getURLParameter(name) {
    return parameters[name];
}
jcubic
  • 61,973
  • 54
  • 229
  • 402
  • It has to be pure javascript. I used that workaround in the past but I'd prefer to get rid of it in this case (otherwise I would have to run PHP support for my script in my server). – Jonhas Mar 05 '13 at 16:19