Affects: IE5, IE5.5, IE6, IE7
Description: Adding a self closing script tag in IE, causes rendering/execution issues.
The script tag has 2 basic structures:
<script type="text/javascript">
//inline script content...
var now = new Date();
</script>
or:
<script type="text/javascript" src="external.js">
//inline logic to execute if loading external script fails
alert('Could not locate external.js');
</script>
Now as a Web developer, the error condition shouldn't really happen, and in most cases is something we'd rather just quietly ignore if it fails. Therefore to minimize the amount of markup sent to the client, this would be the optimal code when referencing an external file:
<script type="text/javascript" src="external.js"/>
However in IE, this will cause rendering issues ranging from a partial script execution to a completely blank page.
What happens is IE doesn't "see" (ignores) the close for this tag, and continues to scan for a closing script tag e.g. "</script>". If it finds one (anywhere in the head tag of the document, then all content in between, will not be executed (i.e. this is treated as the "loading error" logic, resulting in the "partial script execution". The more severe outcome, is if NO closing script tag is found in the head tag, in which case IE considers everything it does find, to be part of the "loading error" logic, and thus renders NOTHING at all!
Some would argue, that since the spec (W3C HTML4.01 - Script Tag) states that the closing tag is required, that IE is not breaking any rules, but most would tend to highly disagree.
Example:
<script type="text/javascript" src="file1.js"/>
<script type="text/javascript" src="file2.js"/>
<script type="text/javascript">
var now = new Date();
</script>
In IE, file2.js will not be loaded, and 'now' will not be set.
Known Workarounds: To avoid this bug, change all references to scripts to have a seperate closing tag, even if there is no content in the tag.
Example Workaround Code:
<script type="text/javascript" src="file1.js"></script>
<script type="text/javascript" src="file2.js"></script>
<script type="text/javascript">
var now = new Date();
</script>
Related Issues: One.
If you find you are getting blank pages, and this issue doesn't fit your scenario, check if this is the issue you are having:
ASP.NET White screen bug (HTTP 413 Request Entity Too Large)
Posts
