在 JavaScript 刚发布的时候，市面上的其它浏览器（甚至包括 Netscape Navigator 的旧版本），都不支持 script 标签。当遇到不认识的标签时，浏览器有两种处理方式：

  1. 将其直接作为文本打印到屏幕上
  2. 直接丢弃

第二种情况不用考虑，反正不能执行，丢弃掉也无所谓。而第一种情况则不行，这样做会把网站的源代码直接暴露到用户面前。

但是浏览器已经发布出去了，又不能撤回。那针对这种情况，应该如何做兼容呢？

其实是一个很巧妙的做法：利用 HTML comment。

HTML comment 有一种特殊的书写方式：

<div>
  <!-- this is a line of comment -->
  <!--
    multiline comment
  -->
</div>

如果我们像下面这样写呢？

<button onclick="print()">print<button>
<script>
<!--
  function print() {
    console.log('this is a script block that\'s wrapped in a piece of html comment')
  }
-->
</script>

既然 script 标签会被不兼容的浏览器处理成文本，那么利用 comment 的特殊书写方式则可以避免文本被打印出来。而支持 script 标签的浏览器再对 script 标签内的 HTML comment 做处理，这样不管浏览器是否支持 script 标签，就都不会有问题了。

兼容性

chrome、safari、Edge 至今都对这种写法表示兼容。

chrome.png

safari.png

edge.png

best practice

这样是 best practice 么？

显然不是。当今市面上的任何一款浏览器都已经对 script 标签做了完善的支持（到 ES5），这种做法已经没有必要了。更何况 JavsScript 已经是前端届的标配了，如果一款浏览器不支持 JavaScript，就代表着这个世界上的绝大部分网站无法在其之上正常运行，何谈使用一说。

注：本文仅供读者了解浏览器发展历史使用，作者亦不建议使用上述 hack 方法。