Can the <script> tag not be self closed?
XhtmlHtmlXhtml Problem Overview
I had this code in my website
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"/>
<script type='text/javascript' src='/lib/player/swfobject.js'></script>
swfobject was not working (not loaded).
After altering the code to:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
<script type='text/javascript' src='/lib/player/swfobject.js'></script>
It worked fine.
The document was parsed as HTML5.
I think it’s funny. Okay, granted a tag that is closed and a self-closing tag are not the same. So I would understand if jQuery couldn’t load (although I find it ridiciulous).
But what I do not understand is that jQuery loads but the following, correctly written tag, doesn’t?
Xhtml Solutions
Solution 1 - Xhtml
In HTML, there are tags which are always self-closed. For example, <hr>Some content here</hr> does not make any sense. In the same way, there are tags which cannot be self-closed. <script> tag is one of them.
I am not sure about the reason of no self-closed <script> tags, but the reason might come from the fact that the tag was intended to always contain code inside. Again, I'm not sure.
Solution 2 - Xhtml
Because it gets parsed as:
Line 1: Start tag for script
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"/>
Line 2: JavaScript (really broken JavaScript!) to execute if the external script mentioned on line 1 fails to load
<script type='text/javascript' src='/lib/player/swfobject.js'>
Line 3: End tag for script started on line 1
</script>
> Okay, granted a tag that is closed and a self closing tag are not the same.
They are the same (if there is no content), but only in XML documents. An XHTML document served as application/xhtml+xml is an XML document. In an HTML document, thanks to a legacy of improper implementations by browsers, a self-closing tag is just a start tag (and so is only OK when the end tag is forbidden).
Solution 3 - Xhtml
David Dorward's answer explains this from one angle, but there is a deeper reason why you can't do this:
A slash at the end of a tag does not make it self-closing in HTML
The self-closing syntax is part of XML. In a normal HTML document, it has no meaning.
Solution 4 - Xhtml
@Joe Hopfgartner: Did you alter the code to test if
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js" />
<script type="text/javascript" src="/lib/player/swfobject.js" />
works? ;-)
Update:
Run the code and the <p> element gets hidden, so...looks like it works?
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>questions/4531772</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"/>
<script type="text/javascript" src="4531772.js"/>
</head>
<body>
<p class="test">Testing...</p>
</body>
</html>
JavaScript (4531772.js)
$(document).ready(function() {
$('.test').hide();
});