On IE 6, a well-formed and validated web page may be rendered as a blank page if you close <script> tags in XHTML style. As in, <script type="text/javascript" ... src="foo.js" />, rather than the HTML style <script type="text/javascript" ... src="foo.js"></script>
So one of my web pages renders great in Safari and Firefox, but in IE 6, it is a completely blank page, devoid of content. Puzzled, I ran it through the W3C validator – no problem at all. Selected a View Source in IE, and noted that the entire HTML output looked OK.
Eventually I narrowed down the problem to a <script> tag in the markup. Namely, a <script type="text/javascript" ... src="foo.js" /> kind of tag. IE rendered the page when I removed the tag, and goes blank when I put it back. Curiously enough, I hadn’t actually invoked any functions from that .js file, so it was definitely not any code I was executing. Replacing the .js file with a dummy .js file also triggered the blank page. Changing or omitting the other attributes did not help.
The problem is fairly obvious now. When I close the tag in HTML style, with an actual </script> tag, IE proceeds to render just fine.
The obvious conclusion is that IE is buggy, but that may not necessarily true (well, in this one instance anyway). Despite most pages’ “compliance” with XHTML, DOCTYPE’ed and all, most web servers still serve these “XHTML” files as mimetype text/html instead of the recommended application/xhtml+xml. This is pragmatic, since IE 6 doesn’t even bother to render application/xhtml+xml, and user agents are required to stop rendering upon encountering non-valid markup (imagine the chaos that would cause).
However, it seems this might introduce a cause for the gotcha. Interpreted in actual text/html mode, one might imagine that to a HTML parser, <script .... /> doesn’t really appear to close the <script> tag at all – in fact, it might merely look like a rather malformed start script tag and no end tag. If I were a dumbly compliant parser+renderer, I might just start walking down the response string looking for that mythical end to this start tag. And end up rendering nothing. Of course, if I were a slightly smarter parser, I would look for a DOCType, but then I’d contradict the server’s mimetype, and down that road lies even more madness.
Nevertheless, the solution, when staring at a blank page in IE when the markup seems fine, is to check your script tags, if any.
I’m no expert at this soup of SGML/HTML/XHTML/XML standards thing, so the above is just my random opinion plus some observations. Still, it seems that MS should patch this particular problem, since it’s fairly non-obvious (many people, I’d surmise, would use the this kind of shorthand close tag in an XHTML file, especially since it validates fine) and upsets the status quo compromise of incremental Web standards compliance through browser compliance modes, content negotiation, and occasionally bad mimetype service. But of course, that’s never going to happen.
Update: I’ve been made aware in the comments section that the same issue occurs in IE 7. Just great.
Just saw your other .innerHTML bug, then noted this in your archives.
This is bug 153 over at Web Bug Track:
http://webbugtrack.blogspot.com/2007/08/bug-153-self-closing-script-tag-issues.html
Using the self closing (valid – xhtml) style tags causes issues in IE. The severity of which depends on the particular order of tags you add to the page.
I have had similar problems with div's rendering incorrectly if they were written as < div/> instead of < div>< /div>. At first I was quite puzzled because this should really be the same after it went through the XML parser.
Soon I realized that the page was being parsed as HTML regardless of the XHTML 1.0 Strict doctype and head meta tag. Only setting the HTTP Content-Type header to application/xhtml+xml forced it to really render as XHTML.
And I did that, only to find out two weeks later that IE doesn't render the XHTML content type _AT ALL_.
So as far as I can see it, without using browser specific logic, I can't really write pages that would render as XHTML anywhere. How lame.
Thank you for helping me out on this one. You set me on the right track so now I've got rid of my blank page. The problem is, just as you describe, that <script> can't be a self-closing tag. So I just changed it to <script src="foo.js" type="text/javascript">dummy</script>.
Even found out that IE have the same problem with self-closing <textarea>-tags.
/Anders
Man, you just saved my day! This issue is present in IE7 and FireFox 3.0.3 as well, and I was literally pulling my hair!
I’ve had the same problem but with pages WITHOUT any tags… HOWEVER I have found that it also applies to the tag. Once I remove it, everything renders fine on the first load. possible work around here? http://www.webmasterworld.com/html/3729894.htm
sorry, without any tags, and applies to the meta http-equiv=”Content-type” content=”text/html;charset=UTF-8″
ARGGG, without any “script/” tags
Very informative and very helpful.. IE6&7 just went up by 10 places in why i hate MS list! Running around like a headless chicken to find why does a page works in FF but not in IE!!
Thanks again for the info
–Sandy