I just like to ask what the title says. The following string required into HTML script tags?
<!-- //--> If I don't use them what would happen?
8 Answers
Not unless you are targeting browsers that predate the <script> element (i.e. Netscape 1 and friends). (Hint: You aren't).
If you don't use them, and a browser that old (so old it can't even cope with the HTTP Host header which is needed for sites that use virtual hosts) tries to access the site, then the content of the <script> element will be treated as text to be displayed.
Further reading: Comments and CDATA: The mysterious history of script and style in HTML
3 Comments
Romain
I wouldn't say "hint: you aren't", but more like "hint: if you are, you're doing it wrong"
Simon Richter
Álvaro raises an important point in his answer though: Without the CDATA escapes, the page is no longer valid XML if a meta character such as
< is contained in the script. I think that relying on applications silently fixing up invalid data is bad style.
Quentin
@Simon Richter — The question is about HTML, not XHTML. It is also specifically about the use of comments around the script block. (And the XHTML issue is mentioned in the link I provide for further reading)
The worse thing that can happen is that your page is retrieved by a user agent that's not aware of the <script> tag and tries to parse your script block as regular HTML. JavaScript code will be handled as regular text and < symbols might interfere with the page markup. A forced example:
<script type="text/javascript"> if(a<del || a>b){ foo(); } </script> Lorem ipsum dolor sit amet. ... could render as ugly deleted text:
if(ab){ foo(); } Lorem ipsum dolor sit amet.
Do these obsolete user agents exists? Oh, sure they do. Please note I've carefully avoided the word "browser". The question is not who's using Mosaic nowadays. It's that a your site can be read by a poorly-written PHP-powered regexp based parser.
Should you care? Well, probably not :)
2 Comments
Simon Richter
This behaviour is not even obsolete.
Quentin
@Simon Richter — Yes, it is. The behaviour occurs when a browser does not recognise a
<script> element (which has been defined since HTML 3.2) (or in XHTML, which this question is not about)If you don't use them, a browser from the early 90's might display the source JS code instead of running it.
answered Nov 8, 2011 at 11:29
Niet the Dark Absol
326k86 gold badges480 silver badges604 bronze badges
Comments
No, they're not required. This habit is required for supporting really old browsers and is slightly related to including CDATA tags which should be included for validation purposes. Neither of them are required, but serve or have served their purpose as is clear from some of the more elaborate answers.
4 Comments
Quentin
CDATA markers have nothing to do with "really old browsers", they are for browsers parsing XHTML with an XML parser (i.e. correctly). The comments have nothing to do with validation (except by accident if they are misused in XHTML).
Pieter
I've rephrased to make it more clear what I meant, but of course you're absolutely right.
Random832
@Quentin I don't think there's anything actually formally prohibiting including the content as text content - it's just that then you are required to escape every greater-than/less-than/ampersand as an html entity. using CDATA means you've only got to deal with the uncommon character sequence
]]> (which you could do by simply including a space between two of the tokens)Quentin
@Random832 — I didn't say anything about the data being prohibited as text content. You can't always deal with
]]> by changing it to ] ]> though … since that is different content.For valid HTML, your inline JavaScript should be HTML escaped.
If you were to write a script such as:
<script type="text/javascript"> document.write('<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>'); </script> There will be an issue, because the script contains </script> which will close the first opening script tag. Older user agents had all sorts of issues with poorly escaped JavaScript, and it was easier to tell people to use:
<script> //<!-- //--> </script> Than it was to teach people to write the script as:
<script type="text/javascript"> document.write('<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>'); </script> Note that JS comments are used to prevent the JavaScript engine from trying to execute <!-- and -->, which might be legitimate statements (a<!--b and a-->b).
Than explain that they actually needed to turn every " to ", < to <, > to > and & to &.
The "modern" fix for this is to use a character data element, which tells the document that everything contained should be treated as literal text:
<script type="text/javascript"> /* <![CDATA[ */ /* ]] */ </script> In this case I'm using multi-line comments so that the code isn't corrupted if it's minified to a single line (some rich text editors have done this to me in the past).
The best solution is to simply keep all HTML in .html files, all CSS in .css files and all JS in .js files. You won't ever have to worry about HTML escaping your JavaScript, and you'll be able to reuse your JS elsewhere simply by inserting a new <script>.
5 Comments
Quentin
There are three separate problems, "Characters with special meaning in XHTML", "The
</ sequence in HTML" and "Browsers which don't recognise the <script> element" and you are getting them somewhat conflated here. e.g. document.write('<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>'); won't work in an HTML document nor will wrapping the contents of the <script> in a comment stop the first </script> from ending the script (mid-JS-string).
Daniel Pryden
I believe the character sequence
<!-- is treated as beginning a single-line comment (equivalent to //) in JavaScript, at least by some user agents. I can't find a reference for that at the moment, though.
zzzzBov
@DanielPryden, doesn't really matter anyway, the html5 spec specifies that a comment cannot contain two consecutive minus signs (
--), which should be a big red flag as a reason not to use a comment around JavaScripts.Daniel Pryden
@zzzzBov: I don't think that applies in this case. A
-- cannot appear inside an HTML comment, but JavaScript comments aren't the same thing.Quentin
@Daniel Pryden — No.
<!-- is an HTML comment that the JS engine ignores, it is not equivalent to //. You can't include -- inside it, because the older user agents that it is designed to protect should treat -- as the end of the comment.Google "why comment out javascript in html", first hit:
http://www.howtocreate.co.uk/tutorials/javascript/incorporate
This is not needed any more. All current browsers are aware of script tags, and how to treat their contents, since they have been part of HTML since HTML 3. Browsers that do not understand HTML 3 or scripts (these are virtually never used now) will display the script as if it was the content of the page. You can hide the script from them by commenting out your script with standard HTML comments.
Comments
99% of the time, they are no longer needed :) Unless your running some really old browser!
Comments
Commenting JavaScript code in such way may also prevents the content from indexing in search engines and may be desirable in some cases.
For example, some time ago I found a lot of "page not found" issues in the Google webmaster tools. After simple analyzing of the urls, I cleared out that Google get all path-like variables from my JS code (like "name/001"), joined them with the current url (mysite.info/staff) and tried to request the resulted url. Without success, of course.
After inserting <!-- //--> in some of JS blocks, all "page not found" issues disappeared in a matter of month or two.
JavaScript <!-- //--> are required?into Google is not very useful.)