load piece of script very last

Question

I'm using this terrible API for a client. It packages HTML/JS to an iPad app.

I'm using iScroll but it interferes with the built-in scrolling mechanism. They've provided some code to disable their scrolling, but it only works when loaded after all other scripts have loaded (so the API says).

My code structure

<head> 
  <script src="scripts1.js"></script>
  <script src="scripts2.js"></script>
  <script src="scripts3.js"></script>
</head>

<body>
  <script>
  //some page specific code
  </script>
</body>

I'm using some jQuery, but their API is in plain JavaScript. How do I execute their code at the very end? I tried putting it at the end of of the page, but that didn't work. Not sure if using timeout is appropriate?

score 1 · Accepted Answer · answered Jun 30 '12 at 15:42

You can use JQuery.getScript and in the success function get other scripts. It should look something like this:

 $.getScript('scriptss1.js', function() {
      $.getScript('scriptss2.js', function() {
            $.getScript('scripts3.js', function() {
           });
     });
 });

score 0 · Answer 2 · answered Jul 01 '12 at 02:53

0

Have you checked out require.js?

answered Jul 01 '12 at 02:53

Will Hitchcock

4,648
3
22
32

score 0 · Answer 3 · answered Aug 08 '14 at 13:44

another option would be to add the defer attribute

<script src="scripts1.js" defer="defer"></script>
<script src="scripts2.js" defer="defer"></script>
<script src="scripts3.js" defer="defer"></script>

see http://www.w3.org/html/wg/drafts/html/master/scripting-1.html#attr-script-defer

load piece of script very last

3 Answers3