嵌套的HTML注释是否可行？

Question

根据标题; 是否可以在有效的HTML中嵌套注释？看下面的例子......

<p>some text</p>

  <!-- comment 1

    <p>commented out html</p>

    <!-- comment 2

      // are nested html comment allowed?

    end of comment 2 -->

    <p>more commented out html</p>

  end of comment 1 -->

<p>some more text</p>

看来不是,有人知道如何让嵌套注释工作吗？

Answer 1

TL; DR:不幸的是,不,这是不可能的(而且永远不会).

简短回答:

HTML评论并不是很多人认为的.HTML是SGML的一种形式,其中注释由双短划线(--...  --)分隔.

因此,在开口括号(<! --⋯ -- >)之后带有感叹号的一对尖括号内的任何一对双短划线都是注释.该规范说它比我更好:http://www.w3.org/TR/html4/intro/sgmltut.html#h-3.2.4

这就是为什么像这样的(这我们的意见都可能做一个时间或其他)是一个坏主意:

<!-- ------------------ HEADER BEGINS HERE -------------------- -->

真相:我太懒了,不能告诉你上面的标签污染代表了多少评论,但它至少是10.

我不那么懒惰:这个所谓的"评论"实际上由10条评论,任何评论之外的三个单词组成(即,只是糟糕的SGML),以及未终止的评论的开头.这真是一团糟:

<!--1----2----3----4----5--
HEADER BEGINS HERE
--6----7----8----9----10-- -->

当然,这不是很简单,因为在每个浏览器选择如何解释规范的差异.

这是一篇很好的文章解释它:

    http://weblog.200ok.com.au/2008/01/dashing-into-trouble-why-html-comments.html

答案很长:为什么我们弄错了

我们大多数使用HTML长大的人(没有深入研究它的基础的SGML))已经开始相信字符串<!--开始注释,字符串-->结束注释.

其实,<!并且>划定了SGML声明你的HTML文档中,比如我们都看到我们的页面顶部的DOCTYPE声明.在 SGML声明中,注释由双短划线分隔.因此,HTML评论

<!-- this is a comment -->

我们大多数人都认为解析像这样<!-- this is a comment -->实际解析如下:
<!-- this is a comment -->.除了注释之外,它是一个空的SGML声明.

因为HTML是SGML的一种形式,所以这种"声明中的注释"用作HTML注释.

出于兴趣,这里有一大块纯SGML,它显示注释在SGML中的作用:这个属性列表定义包含对每一行的注释:

<!ATTLIST LINK
  %attrs;                              -- %coreattrs, %i18n, %events --
  charset     %Charset;      #IMPLIED  -- char encoding of linked resource --
  href        %URI;          #IMPLIED  -- URI for linked resource --
  hreflang    %LanguageCode; #IMPLIED  -- language code --
  type        %ContentType;  #IMPLIED  -- advisory content type --
  rel         %LinkTypes;    #IMPLIED  -- forward link types --
  rev         %LinkTypes;    #IMPLIED  -- reverse link types --
  media       %MediaDesc;    #IMPLIED  -- for rendering on these media --
>

Answer 2

嵌套注释时,将" - "替换为" - - ".取消嵌套时,请反转该过程.这不是<!--被禁止的,而是被禁止的--.

例:

<!-- some stuff
<!- - some inner stuff - ->
<!- - a sibling - ->
the footer -->

Answer 3

它无法完成.-->将始终结束现有的HTML评论.

Answer 4

<!-- comment1 <!-- comment2--> -->不允许嵌套 HTML 注释。

但是你可以通过使用<script>标签和/* */（Hacky解决方案）来实现：

<script>
/*
  HTML code you want to comment on goes between the Javascript comment section
*/
</script>

注意：您还可以在同一个 HTML 文件中包含多个<script>...</script>对，以注释掉代码的不同部分。

示例：下面评论"Some Statement 2, 3, 4, 5 and 6"

<p> Some Statement 1 </p>

<script>
/*
<p> Some Statement 2 </p>

<!-- explanation about below statement 3 by the comment tag -->
<p> Some Statement 3 </p>

<!-- 
<p> Some Statement 4 </p> 
<p> Some Statement 5 </p>
-->

<p> Some Statement 6 </p>
*/
</script>

<p> Some Statement 7 </p>

Answer 5

如果您确实对某些HTML（在某些不可控制的源中预渲染）非常感兴趣，其中包含注释，并且需要确保没有HTML呈现在您的页面上，则可以始终使用以下script标记将其包装起来，唯一的事情是，您不能以script这种方式注释掉标签。

<p>some text</p>

<!-- multiline "comment" below using script type="text/html" -->
<script type="text/html">

  <p>commented out html</p>

  <!-- comment 2

      // are nested html comment allowed?

    end of comment 2 -->

  <p>more commented out html</p>

</script>

<p>some more text</p>

如果您需要注释掉script标签，则可以改用textareaas包装器，这种方式当然会导致注释掉textarea。

<p>some text</p>

<!-- multiline "comment" below using textarea style="display:none;" -->
<textarea style="display:none;">

  <script>  

    alert("which won't show up..");  

  </script>

  <p>commented out html</p>

  <!-- comment 2

      // are nested html comment allowed?

    end of comment 2 -->

  <p>more commented out html</p>

</textarea>

<p>some more text</p>

Answer 6

使用template标签.阻止所有评论和其他HTML显示的最快方法.

<template>
    <!-- first paragraph-->
    Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

    <!-- second paragraph-->
    Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</template>

    <!-- third paragraph-->
    Ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.sunt in culpa qui officia deserunt mollit.