How to load JS last in IE 8 and 7

Question

Ok.. So I have done a bit of research and haven't found much on this. So was wondering if someone can enlighten me.

I like to load my Script at the bottom of the page like below

<html>
  <head>
    CSS Goes here
  </head>
    <body>
       <div id="container">
       </div>
       <script></script>
       <script></script>
    </body>
 </html>

Which works fine in all modern browsers but I found in IE 8 and 7 the JS had to be in the head instead of in the body for it to work. So was wondering why and what the work around is as I would prefer to load JS files after everything else.

Thanks

Any reason why it should be included at the bottom? And why it doesn't work in IE8- ? Can u post the script? — Yuriy Galanter, Aug 19 '13 at 18:46
Loading JavaScript at the bottom is a great way to avoid halting until the DOM is finished to start rendering the HTML — Jason Sperske, Aug 19 '13 at 18:47
http://developer.yahoo.com/blogs/ydn/high-performance-sites-rule-6-move-scripts-bottom-7200.html — Jason Sperske, Aug 19 '13 at 18:48
Before end of body tag: http://stackoverflow.com/questions/436411/where-is-the-best-place-to-put-script-tags-in-html-markup — Sergio, Aug 19 '13 at 18:49
Why does it only work while in the head? Must be something wrong with your JS. — Tim B James, Aug 19 '13 at 18:49
"I found in IE 8 and 7 the JS had to be in the head instead of in the body for it to work" - well, it sounds like the issue is specific to your JavaScript. Hard to answer without a demo that's broken in IE7/8. — thirtydot, Aug 19 '13 at 18:49
I've used this technique many times. It has no issue with IE. You are doing something incorrectly. Post your code and we can probably help you figure it out =D — BentOnCoding, Aug 19 '13 at 18:50
You could be running into the bug where IE7/8 doesn't allow you to modify the document.body from within the document.body, but we can only speculate since you haven't provided any code. — Kevin B, Aug 19 '13 at 18:53
try creating an onpageload handler that uses document.write to add a script tag that loads your javaScript. — DwB, Aug 19 '13 at 18:54
@DwB wouldn't using document.write after page load destroy the page? — Kevin B, Aug 19 '13 at 18:55
I believe document.write will append at the end of the document. — DwB, Aug 19 '13 at 18:56
wow alot of stuff here, demo is up at here:madaxedesign.co.uk/dev/ give me a chance to change over the scripts — MaxwellLynn, Aug 19 '13 at 19:07
It appears that document.write is not a good way. Here is a reference article: http://stackoverflow.com/questions/802854/why-is-document-write-considered-a-bad-practice I recommend against using W3Schools as a reference. Here is a mozilla article https://developer.mozilla.org/en-US/docs/Web/API/document.createElement — DwB, Aug 19 '13 at 19:08
possible duplicate of: http://stackoverflow.com/questions/807878/javascript-that-executes-after-page-load — DwB, Aug 19 '13 at 19:11
hmm but that shouldn't effect it working though I'd of thought. And im using document.ready, off the top of my head for all of them — MaxwellLynn, Aug 19 '13 at 19:17
I think the problem is that I'm bundling my javascript to make it load faster. When I do it all seperatly then it works perfectly — MaxwellLynn, Aug 19 '13 at 19:36
Thanks for all your help guys. Really shocked how many people have responded — MaxwellLynn, Aug 19 '13 at 19:36

MaxwellLynn · Answer 1 · 2013-08-21T09:30:16.993

0

Ok so just figured this all out. Basically I needed to load all the js at the bottom apart from the htmlshiv js file which I have now put in my head, works fine now.

Jquery only manipulates html so its fine to load it after the html but the shiv actually reprograms the way a browser loads html so it need to be loaded before the html.

Thanks very much everyone

edited Aug 21 '13 at 09:30

answered Aug 21 '13 at 09:22

MaxwellLynn

613
5
19
40

How to load JS last in IE 8 and 7

1 Answers1