使用 HTML 注释标记 < ! —— > 仍然与 JavaScript 代码相关吗?

在 JavaScript 代码周围使用 HTML 注释标记是否仍然相关?

我是说

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

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

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.

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.

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.

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.

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__>