Question

I have a couple of JavaScript functions that I would like to reuse on multiple different pages, so I created an external .js file for the functions. I was wondering if it was possible to change the global variables of that javascript without changing the actual .js file. Here’s an example of what I mean:

Suppose I have this tag for my external JavaScript:

<script src="myscripts.js"></script>

Could I somehow define the global variables for the scripts in the <script> tag like so?

<script src="myscripts.js">
    sampleglobalvariable = "somevalue";
    sampleglobalvariable2 = "somevalue2";
</script>

Or like so?

<script src="myscripts.js"></script>
<script>
    sampleglobalvariable = "somevalue";
    sampleglobalvariable2 = "somevalue2";
</script>

Or would I have to define them inside the actual myscripts.js file?

Answer 1

You can do this:

<script>
    var sampleglobalvariable = "somevalue";
    var sampleglobalvariable2 = "somevalue2";
</script>

<script src="myscripts.js"></script>

myscripts.js will have access to the global variables defined before.

Alternatively you can turn myscripts.js into a server-side script (written in PHP for example). That would let you pass parameters like this:

<script src="myscripts.js?foo=1&bar=2"></script>

The server-side script would then have to read $_GET['foo'] and
$_GET['bar'] and echo custom generated javascript back:

echo 'var sampleglobalvariable = ' . json_encode($_GET['foo']) . ';';
echo 'var sampleglobalvariable2 = ' . json_encode($_GET['bar']) . ';';
echo 'alert(sampleglobalvariable);  // rest of the script, etc';