Using HTML comment tag <!-- --> still relevant around JavaScript code?

JavascriptBrowser

Javascript Problem Overview


Is it still relevant to use HTML comment tag around JavaScript code?

I mean

<html>
    <body>
        <script type="text/javascript">
            //<!--
            document.write("Hello World!");
            //-->
        </script>
    </body>
</html>

Javascript Solutions


Solution 1 - Javascript

HTML comments, ie. <!-- -->, are no longer needed. They were intended to allow browsers that didn't understand the <script> tag to degrade gracefully. These browsers, eg. Netscape 1.x are no longer found in the wild. So there is really no point in putting HTML comments in your script tags anymore.

If you want your HTML to validate as XHTML or XML, you probably want to use a commented out CDATA tag.


<script type="text/javascript">
//<![CDATA[
document.write("Hello World!");
//]]>
</script>

The reason for this is so your <, >, &, " and ' that are part of your javascript code won't have to be encoded as &lt;, &gt;, &amp;, &quot; and &apos; respectively.

Solution 2 - Javascript

Not really, unless you're targeting 20-year-old browsers.

Solution 3 - Javascript

It is better to just avoid JavaScript in the body all together. It makes things easier to update, avoids the needs for comments and forces you to plan for non-JavaScript enabled users as well as users with JavaScript enabled.

Solution 4 - Javascript

Not the way you are doing it, no.

The <!-- is treated the same as // in javascript, so your code should instead look like this:

<script type="text/javascript">
<!--
document.write("Hello World!");
//-->
</script>

..the difference with yours being that a rare obscure browser that may not understand the script tag will print the opening // to the screen, which kind of defeats the purpose of putting the comment tag there in the first place.

Here's more info on it here if you are curious: http://www.javascripter.net/faq/comments.htm

However in the end even super obscure browsers that don't support javascript by default (like HTMLLayout browse or Netsurf) know it is best not to render the text between script tags, so no, it is no longer relevant by any means. However all browsers you could possibly care about understand the <!-- syntax, so there is no real need to madly worry about removing it from what you already have, because it is valid js, just remember to not add it next time.

Solution 5 - Javascript

Even in modern browsers, it can be useful. I actually ran into this problem today, precisely because I wanted to avoid having javascript embedded in my html.

I have an html page that is served up on http://host/variable_app_name/pagename, where variable_app_name can have many values (y'know, variable). If it wants to access static files it has to use a url like http://host/static/variable_app_name/filename, so I cannot specify the static file location without first looking at browser's location to find the value of variable_app_name.

To link to the main javascript file I do the following:

<script type="text/javascript" >
   var variable_app_name = window.location.pathname.split('/')[1];
   document.write('<script type="text/javascript" src="/static/'+variable_app_name+'/pagename.js"></script>\n');
</script>

The above code will explode even in the latest version of Chrome, because the script tag will be terminated in the middle of a javascript string and the remainder of the string will be interpreted as html, like so:

<script type="text/javascript" >
   var variable_app_name = window.location.pathname.split('/')[1];
   document.write('<script type="text/javascript" src="/static/'+variable_app_name+'/pagename.js">
</script>
\n');
</script>

There are many ways to fix this, but I like to use an html comment.

With html comment:

<script type="text/javascript" >
<!--
   var variable_app_name = window.location.pathname.split('/')[1];
   document.write('<script type="text/javascript" src="/static/'+variable_app_name+'/pagename.js"></script>\n');
-->
</script>

Breaking up the javascript string:

<script type="text/javascript" >
   var variable_app_name = window.location.pathname.split('/')[1];
   document.write('<script type="text/javascript" src="/static/'+variable_app_name+'/pagename.js"></scr'+'ipt>\n');
</script>

Create and append the script tag rather than using document.write:

<script type="text/javascript" >
   var variable_app_name = window.location.pathname.split('/')[1];
   var script = document.createElement('script');
   script.type = 'text/javascript';
   script.src = '/static/'+variable_app_name+'/pagename.js';
   document.head.appendChild(script);
</script>

I like to use the html comment because it's a concise change and it won't need replicating or thinking about for each linked file.

Solution 6 - Javascript

if your looking to comment out js include lines or a complete js block of code, just rename the tag name like below:

Example before:

<script src="js/notification.js"></script>

Example After:

<script__ src="js/notification.js"></script__>

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionrajakvkView Question on Stackoverflow
Solution 1 - JavascriptAsaphView Answer on Stackoverflow
Solution 2 - JavascriptSasha ChedygovView Answer on Stackoverflow
Solution 3 - JavascriptscragarView Answer on Stackoverflow
Solution 4 - JavascriptandwhyisitView Answer on Stackoverflow
Solution 5 - JavascriptJoolsView Answer on Stackoverflow
Solution 6 - JavascriptSaleh AbdulazizView Answer on Stackoverflow