How to combine inline JavaScripts into one?

Question

I'm fixing up a template we're using on one of our sites which has the following code

This snippet works.

<script type="text/javascript" src="http://partner.googleadservices.com/gampad/google_service.js"></script>

<script type="text/javascript">
  GS_googleAddAdSenseService("ca-pub-123");
  GS_googleEnableAllServices();
</script>

<script type="text/javascript">
  GA_googleAddSlot("ca-pub-123", "Foo");
  GA_googleAddSlot("ca-pub-123", "Bar");
</script>

<script type="text/javascript">
  GA_googleFetchAds();
</script>

I've tried concatenating the static scripts like this

<script type="text/javascript" src="http://partner.googleadservices.com/gampad/google_service.js"></script>

<script type="text/javascript">
  GS_googleAddAdSenseService("ca-pub-123");
  GS_googleEnableAllServices();

  GA_googleAddSlot("ca-pub-123", "Foo");
  GA_googleAddSlot("ca-pub-123", "Bar");

  GA_googleFetchAds();
</script>

However, now I'm getting an error

Uncaught ReferenceError: GA_googleAddSlot is not defined 

I'm no noob when it comes to JavaScript stuff, but I can't imagine why combining the 3 inline scripts into a single <script> tag would make any difference here.

Any ideas?

Answer 1

google_service.js does not define GA_googleAdSlot, but it defines GS_googleEnableAllServices. When GS_googleEnableAllServices is called, it uses document.write to insert a new script element which loads a definition of GA_googleAdSlot. The new script element is inserted in the document after the end of the script element currently being executed. It's complicated, but it's your answer.