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: //-->.

Pale

Isn't that just a poor man's CDATA wrapper? I've never used it. – Heterocercal

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.

Alberik

Thanks Marc! I had just mistyped the closing comment and it actually is how you typed it - //-->. I believe the code originated in an automated tool via Google's doubleclick service. Hopefully I can edit the automated code in the future. – Pale

Actually, --> is treated as a SingleLineComment (equivalent to //) when it’s at the start of a line, optionally preceded by whitespace or MultiLineComments. See my answer. – Tilbury

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.

Tilbury

It seems the link is broken, I believe the spec is at tc39.es/ecma262/#sec-html-like-comments – Unchancy

Answer 3

No, there is no reason to include them. I regularly omit those comments and have no problems with modern browsers.

Cyndicyndia

Answer 4

<script> inside strings set via innerHTML never runs (primarily because it never has in IE and then sites depended on that, so when other browsers reverse-engineered the innerHTML implementation they had to do that too). The HTML comments there are a red herring.

If you need the <script> to run, you need to use some other method of inserting the nodes (e.g. createContextualFragment).

Montespan

Well, this is what is actually being used (jQuery): $('#some-element-id').html(htmlContent); – Pale

@MikeMoore - jQuery detects when the string passed to html() contains script blocks and if so, it doesn't use innerHTML. It will explicitly pluck out the script blocks and eval() them for you. See this thread for details. – Wildeyed

Answer 5

HTML comments in script blocks have not been necessary for many years. Omitting them won't cause any problems.

References: http://javascript.crockford.com/script.html

Finance