元素的开标签中的HTML注释

Question

当我尝试这样做时

<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注释是否允许在元素的开放标签内？

- Jawad

---

正如 David 指出的那样，你不能在另一个标签内添加注释。此外，你不应该需要注释 HTML 标签，因为它们是自我描述的。没有必要向正在阅读代码的人解释算法。所以它们有点多余和无意义。 - Federico klez Culloca

将评论放在标签内部的原因不是为了记录正在发生的事情，而是可能希望在开发过程中禁用某个属性而不删除它。 - Andrew Magee

嵌套注释有一个非常严重的用例经常被忽视。如果一个代码块中包含一个块注释，你不能将其注释掉而不去除该块内部的注释。没有理由不允许注释嵌套，除了兼容性问题，因为本质上，它只是一个“括号匹配”算法，可以去除括号内的所有内容。这将使注释删除算法更加昂贵（它不能再简单地使用正则表达式，现在必须解析每个注释），但回报是注释现在不会对未来的注释造成干扰。 - Dmytro

我的建议是使用<noscript class="comment">comment</noscript>，它没有<!-- -->的限制，然后在文档解析之前，让JavaScript将其outerHTML设置为空字符串。noscript是首选，因为它是除了脚本以外唯一一个标准标签，足够无意义，使得这种做法有意义。 - Dmytro

Answer 1

HTML注释不允许出现在标签的内部、开始或结束位置。

- Quentin

---

我想知道是否可以提供文档链接。 - Hebe

https://html.spec.whatwg.org/multipage/syntax.html#start-tags - Quentin

Answer 2

HTML标签内注释的解决方法

HTML不允许您使用<!--和-->来标记标签内的注释。但是，对于主要用例，有一些解决方法。

在HTML标签中添加注释

您可以随意编写一个属性名称，仅用于自己进行注释。例如：

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

主要的缺点是在压缩时这些注释不会被清除，因此：

• 它将占用您提供给用户的最终 HTML 文档的空间
• 如果用户单击 查看源代码，他们将能够阅读您的注释

临时禁用属性

只需使用您决定用于指示临时禁用的前缀来重命名属性。例如，要禁用名为 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>

再次提醒，这些内容在缩小文件时不会被剥离，因此它们将占用最终用户接收到的文件空间，并且可以通过“查看源代码”查看。

- Eureka

---

请注意，在style属性中，您可以使用/*...*/CSS注释。此外，您还可以在标签内插入换行符以便于阅读。 - Paracetamol

Answer 3

我已经开始制定一种用于结构化HTML注释的标准，名为“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>

- Jonathan

---

这个答案与问题无关。 - Gogol

我承认这不是一个直接的答案（因为HTML不允许行内注释），但我认为这是下一个最好的解决方案。我认为这个解决方案确实回答了提问者关于添加有关特定HTML属性的注释的需求。你不同意吗？ - Jonathan

@Jonathan 好的，我其实是来这个问题寻找一种在元素标签内部放置注释的方法。我正在尝试开发一个所见即所得编辑器插件，该插件将允许保护元素内部的代码（例如，允许在tinymce/ckeditor中编辑<div <?php echo "test"?> id="something">abc</div>）。受保护的插件对于这些情况不起作用，所以对于我的情况，这个答案根本不适用 :).. 对于其他人可能适用。 - Gogol

听起来像是一个有趣的项目 @Gogol - Jonathan

Answer 4

根据HTML注释标签，这些注释是像其他HTML标签一样的标签，因此不能放置在起始标签或结束标签内。没有问题。

- Matthias

Answer 5

我们不能在HTML标签内部使用注释，但我们可以在HTML标签前后使用注释。

- pinakipb2

Answer 6

您可以通过在属性上加删除线来禁用它们，也可以用引号注释掉。

Ex.:

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

你选择的规则。

- Zano