【问题标题】：HTML Comments inside Opening Tag of the Element元素开始标签内的 HTML 注释
【发布时间】：2011-08-21 01:26:06
【问题描述】：

当我尝试这个时

<option disabled = "disabled" <!-- Used to disable any particular option -->
        selected = "selected" <!-- Used to pre-select any particular option -->
        label = "string"      <!-- Used to provide a short version of the content in the option --> 
        value = "value">      <!-- The actual value that will be send to the server. If omitted the content between the option opening and closing tags will be send. -->

Option 1
</option>

我试图在元素的开始标签内注释属性和值。但是，这不起作用，因为浏览器（在 IE9、FF4.01、GG11、AF5 和 Opera11 上测试）将 disabled="disabled" 之后的所有内容视为评论或内容。

HTMl Comments 是否不允许在元素的开始标签内？

【问题讨论】：

正如大卫所指出的，您不能将 cmets 放在另一个标签中。此外，您不需要注释 html 标签，因为它们是自描述的。您无需向阅读代码的人解释算法。所以它们有点多余和毫无意义。
某人想要在标签内添加评论的原因不是他们想要记录正在发生的事情，而是他们可能想要在开发过程中禁用属性而不删除它。
嵌套 cmets 有一个非常严重的用例，但经常被忽视。如果不剥离该块内的 cmets，则无法注释掉其中包含块注释的代码块。除了兼容性问题，cmets 没有理由不嵌套，因为从本质上讲，它只是一种“括号匹配”算法，将括号内的所有内容都去掉。这将使评论删除算法更加昂贵（它不能再简单地使用正则表达式，它现在必须解析每条评论），但回报是 cmets 现在不会对未来的 cmets 造成破坏。
我的建议是使用<noscript class="comment">comment</noscript>，它没有 的限制，然后在文档开始解析它之前，让javascript 将它的outerHTML 设置为一个空字符串。 noscript 是首选，因为它是除了 script 之外唯一没有意义的标准标签。

标签： html tags comments

【解决方案1】：

HTML cmets 根本不允许在标签内，无论是开始还是结束。

【讨论】：

【解决方案2】：

HTML 标签内 cmets 的解决方法

HTML 不允许您使用  在标签内标记 cmets。但是，对于主要用例有一些解决方法。

在 HTML 标记中添加注释

您可以只使用一个属性来评论自己。例如：

<div comment="Name and Id">
   ... 
</div>

主要的缺点是在缩小过程中不会剥离 cmets，所以：

它会在您提供给用户的最终 HTML 文档中占用空间
如果用户点击View source，他们将能够读取您的 cmets

暂时禁用一个属性

只需使用您知道的表示临时禁用的前缀重命名属性。例如，要禁用名为 option 的属性：

<div option="big">
   ... 
</div>

变成

<div DISABLED-option="big">
   ... 
</div>

如果确实存在名为disabled-option 的有效属性，则显然不要这样做。

暂时禁用类或样式

由于如果您使用不存在的类或样式不会出现错误消息，您可以这样做来禁用类或样式：

例如，要禁用名为 tall 的类，同时保留名为 highlighted 的类：

<div class="highlighted tall">
   ... 
</div>

变成

<div class="highlighted DISABLED-tall">
   ... 
</div>

同样，禁用color 样式同时保留font-weight 样式：

<div style="font-weight:700; color:red;">
   ...
</div>

变成

<div style="font-weight:700; DISABLED-color:red;">
   ...
</div>

同样，请记住，这些不会在缩小过程中被删除，因此它们会占用最终用户收到的文件中的空间，并且可以通过 View source 查看。

【讨论】：

【解决方案3】：

我已经启动了一个用于构建 HTML cmets 的标准，称为“HTMLDoc”，类似于用于 Javascript 的 JSDoc、用于 Java 的 JavaDoc 等。

您可以在此处阅读：http://usehtmldoc.surge.sh。

它允许在标签、属性和值级别记录。

对于您的代码，它可能看起来像这样：

<!--
@tag option
@attribute disabled Used to disable any particular option
@attribute selected Used to pre-select any particular option
@attribute label Used to provide a short version of the content in the option
@attribute value The actual value that will be send to the server. If omitted the content between the option opening and closing tags will be send.
-->

<option disabled = "disabled"
        selected = "selected"
        label = "string"
        value = "value">
Option 1
</option>

【讨论】：

这个答案与问题无关。
@Gogol 我承认这不是一个直接的答案（因为正如所指出的，HTML 不允许内联 cmets），但我认为这是下一个最佳解决方案。我认为这个解决方案确实解决了提问者所说的需要添加有关特定 HTML 属性的 cmets。你不同意吗？
@Jonathan 很公平。实际上，我来这个问题是为了寻找一种将 cmets 放置在元素标签内的方法，哈哈。我正在尝试开发一个所见即所得的编辑器插件，它允许保护元素内的代码（例如，允许在 tinymce/ckeditor 中编辑
id="something">abc
。受保护的插件不适用于这些情况），所以对于我的情况..这个答案根本不适用 :).. 对于其他人它可能适用。
听起来是个有趣的项目@Gogol

【解决方案4】：

没有。
根据HTML comment tag，这些 cmets 是与任何其他 HTML 标记一样的标记，因此不能放置在开始或结束标签内。

【讨论】：

【解决方案5】：

我们不能在 HTML 标签内使用 cmets，但我们可以在 HTML 标签之后或之前使用 cmets。

【讨论】：

【解决方案6】：

您可以删除属性以禁用它们，也可以用引号将其注释掉。

例如：

<option 
  disabled = "disabled" "--Used to disable any particular option"
  selected = "selected" "--Used to pre-select any particular option"
  label    = "string"   "--Used to provide a short version of the content in the option"

  "--You can erase the attribute to disable it:"
  *value = "value"
  -class = "myOptions"
  
  "--Disabling doesn't work with any characters:"
  //id  = "myOption" "--This won't disable it"
  
>Option 1</option>

你选择的规则。

【讨论】：