HTML comments in a javascript block?

Question

I have a function like this one (below) which inserts a block of HTML code in an HTML page:

function someEventHandler(htmlContent)
{
  document.getElementById('some-element-id').innerHTML = htmlContent;
}

This works fine for HTML code that includes an img tag.

When the HTML code includes <script> blocks, though, they do not render. Furthermore, the script blocks contain JavaScript that is surrounded by HTML comments. For example:

<script type="text/javascript">
<!--
    function someFunctionThatRendersStaticImageOrFlash()...
-->
</script>

These script blocks that contain HTML comments do not render after they have been inserted. I have control over the code that is inserted and I tested it without the HTML comments, and they rendered successfully.

It is my understanding that HTML comments like this were used in early versions of Netscape, to prevent problems with browser incompatibility with javascript.

Is there any other reason (or any good reason) to include HTML style comments in a javascript block?

Edit I mistyped. The closing comment is: //-->.

Answer 1

Actually, only <!-- is valid javascript. To end the html comment in javascript, you actually need to use //-->.

These days it's not really required to use the HTML comments in Javascript anymore. Browsers which are so old as to not understand the <script> tag are highly unlikely to be able to render much of anything on a "modern" website, and you should not have to accommodate users who are quite literally on a stone-age browser.

However, if you're intending to include your HTML inside an xml document, and/or are writing x-html, then you'll have to use the xml <![CDATA[ and ]]> enclosures, as various Javascript operators (&, <, and > in particular) will cause XML parse errors without the enclosures.

Answer 2

This is a previously non-standard feature that browsers and JavaScript engines have always implemented. Nowadays, it cannot be removed from the Web platform, as that would break backwards compatibility. It’s detailed in the JavaScript / Web ECMAScript spec:

<!-- must be treated as the start of a SingleLineComment — equivalent to //.

var x = true;
<!-- x = false; // note: no syntax error
x; // true

--> at the start of a line, optionally preceded by whitespace or MultiLineComments, must be treated as a SingleLineComment — equivalent to //.

var x = true;
--> x = false; // note: no syntax error
x; // true

var x = 1;
/*
multiline comment!
x = 2;
*/ --> x = 3;
x; // 1

Update: This is now upstreamed to the ECMAScript spec. For more background info, see Sunsetting the JavaScript Standard.