Self closing script tag

While I’m having fun with CoffeeScript those last few days, to try it out I’m creating plain old HTML pages sometimes. Just a simple, messy html to see how script behaves in browser. Of course to do that script must be either part of html file itself or included into it using script tag. Simple enough, done that like hundred times over the last few years.

But apparently doing something many times does not mean you will do it correctly next time. Or you will know how to do it correctly. An hour ago I would not be able to tell what’s wrong with this file:

Seems correct, doesn’t it? All tags closed, all tags present. Sure – that’s not the nicest html you will see, but should do the job. Yet, there is small, but serious issue that will cause JavaScript code not to be executed. It’s the self closing script tag.
This StackOverflow discussion gives detailed answer to the problem: Why don’t self-closing script tags work?.
But just to sum it up – you will either need to explicitly mark that your document’s MIME type is application/xhtml+xml or use explicit closing in script tag. This is because browsers interpret tags in some way that causes them to generate content different than expected. For example, the above code could end up with html looking like:

The alert is out of the script section, causing it to be interpreted as normal html which is rubbish.

So this was a good day – learnt something new. Hope you learnt something too!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s