While trucking away at $work, Jim pointed out a subtle nasty edge case in how JavaScript and the browser interact. Let’s say you have the following code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>shared var</title>
<script type="text/javascript">
var foo = "awesome";
bar = "bartastic";
window.baz = "bazzoom";
</script>
<script type="text/javascript">
if(!window.foo) var foo = "not awesome";
if(!window.bar) var bar = "not bartastic";
if(!window.baz) var baz = "not bazzoom";
</script>
</head>
<body>
<p>Foo is <script type="text/javascript">document.write(foo);</script></p>
<p>Bar is <script type="text/javascript">document.write(bar);</script></p>
<p>Baz is <script type="text/javascript">document.write(baz);</script></p>
</body>
</html>
I think most folks would expect the output to be:
Foo is awesome
Bar is bartastic
Baz is bazzoom
and it is on Firefox, Safari and Opera, but on IE you get:
Foo is awesome
Bar is bartastic
Baz is not bazzoom
Care to guess why?