Question

I tried many ways, and can’t figure how to do this.

I am loading number of external scripts in the header of many html files. Here is an example:

<script type="text/javascript"  src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
<script type="text/x-mathjax-config">
MathJax.Hub.Config({  tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
</script>

<script type="text/javascript" language="Javascript" 
        src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js">
</script>

<script type="text/javascript" src="http://www.wolfram.com/cdf-player/plugin/v2.1/cdfplugin.js"></script>

What is the best way to avoid having to copy and paste these again and again in each HTML file?

I could not put all of these in one common.js file and include that, since these already have <script> in them. i.e. I can’t do this

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

Any idea how to do this? may be with jquery? (I know nothing about it). May be this is related? Jquery load() a html file which contains JavaScript

thanks

Answer 1

You can use the following commands multiple times in your common.js for each source you want to load. Just keep changing the node.src value.

    var node = document.createElement('script');
    node.src = "https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js";
    document.body.appendChild(node);

And you can choose where to add your script in body i.e. document.body.appendChild(node); or head i.e document.head.appendChild(node); of html