Javascript数组推迟JS加载Joomla

Question

I am deferring the loading of some js files in my Joomla template. This works fine

    <script type="text/javascript">
        function downloadJSAtOnload() {
            var element = document.createElement("script");
            element.src = "/pathto.js";
            document.body.appendChild(element);
        }
        if (window.addEventListener)
            window.addEventListener("load", downloadJSAtOnload, false);
        else if (window.attachEvent)
            window.attachEvent("onload", downloadJSAtOnload);
        else window.onload = downloadJSAtOnload;
    </script>

However, I have about a dozen js files to load like this and for each one I'm having to use the same block of code as above with just the pathto.js being different.

My Javascript abilities are pretty rubbish. Is it possible to put all the js files into an array and then just go through them one by one using the same block of code without having to repeat the same block over and over?

What I'd like is something like

    <script type="text/javascript">
        function downloadJSAtOnload() {
            var element = document.createElement("script");
            element.src = AN ARRAY OF JS FILES;
            document.body.appendChild(element);
        }
        FOR EACH ITEM IN THE ARRAY
            if (window.addEventListener)
                window.addEventListener("load", downloadJSAtOnload, false);
            else if (window.attachEvent)
                window.attachEvent("onload", downloadJSAtOnload);
            else window.onload = downloadJSAtOnload;
    </script>

Thanks for any help with this!

Answer 1

Actually the loop should be in the function.

Here's what the function should be (I haven't tested it):

function downloadJSAtOnload() {
    var scripts = ["script1.js", "script2.js", "script3.js"];
    for (i = 0; i < scripts.length; i++) {
        var element = document.createElement("script");
        element.src = scripts[i];
        document.body.appendChild(element);
   }
}