Patrick Lanfranco
Patrick Lanfranco

Reputation: 309

Combine 2 scripts into 1 file

I have two scripts that load in my head area which are:

    <script type="text/javascript">
       var myDate = new Date();
       var myStamp = ""+myDate.getDate()+myDate.getMonth()+myDate.getFullYear()+myDate.getHours()+myDate.getMinutes();
       document.write('<script type="text/javascript" src="https://scriptlocation.com/js/script.js?' + myStamp + '"><\/script>');
    </script>
    <script type="text/javascript">
       document.write('<script type="text/javascript" src=""https://scriptlocation.com/js/script2.js?'+SVNInfo.revision+'"><\/script>');
    </script>

My ideal scenario would be to merge these two into 1 javascript file, so I've tried to create a new file which contains the following:

       var myDate = new Date();
       var myStamp = ""+myDate.getDate()+myDate.getMonth()+myDate.getFullYear()+myDate.getHours()+myDate.getMinutes();
       document.write('<script type="text/javascript" src="https://scriptlocation.com/js/script.js?' + myStamp + '"><\/script>');
       document.write('<script type="text/javascript" src=""https://scriptlocation.com/js/script2.js?'+SVNInfo.revision+'"><\/script>');

however that does not seem to work as the script is not being loaded properly. Do I need to rewrite / change something to have this working correctly?

Some advice would be greatly appreciated.

Upvotes: 0

Views: 195

Answers (2)

bobince
bobince

Reputation: 536339

SVNInfo is defined by the first script. So you can't include the second script (whose source path includes the value of SVNInfo) until you've executed the first.

When you document.write content from a <script> block, it's adding new content for the HTML parser at the point just after the </script> end-tag of the current block. If that content itself includes a <script> element, then the script inside it cannot start to execute until the current script has finished. So the </script><script> tags break up the current script execution allowing the script inserted by document.write to run. You won't be able to put both writes into the same script without breaking this.

You may be able to do it the way pete suggests with inserting script elements directly into the DOM, avoiding the parser completely. Because no parser is involved, the inserted script can execute straight away, without waiting for the current script block to complete.

However, you will need to ensure that the first script element is added to the document and run before you attempt to set the src of the second script element, because you need SVNInfo to be ready. Also, you should append the scripts to the <head> element and not <body> because writing to an element that hasn't been completely parsed yet is likely to cause the page load to abort in IE.

It is also possible that this might still not work, if there's something in the second script that expects to be running from a document.write-invoked script. Can't really see from here as the script is unreadable compressed.

Given that the integration doc tells you what it wants you to do, I'd stick with that; even if you have a better way, they might change the script at some point in the future in a way that relies on the two document.write scripts.

Upvotes: 2

pete
pete

Reputation: 25081

This should do the trick.

<script type="text/javascript">
    var myStamp = (new Date()).getTime(), //easier way to get a relatively unique timestamp
        script1 = document.createElement('script'),
        script2 = document.createElement('script'),
        body = document.getElementsByTagName('body')[0];
    script1.setAttribute('type', 'text/javascript');
    script1.setAttribute('src', 'https://scriptlocation.com/js/script.js?' + myStamp);
    script2.setAttribute('type', 'text/javascript');
    script2.setAttribute('src', 'https://scriptlocation.com/js/script2.js?' + SVNInfo.revision); //is SVNInfo.revision defined?
    body.appendChild(script1);
    body.appendChild(script2);
</script>

For the record, document.write is an extremely primitive (and not a friendly way) of adding scripts to the page. Just create them as elements and then add them to the DOM.

Upvotes: 2

Related Questions