javascript - 为什么 outerHTML 会带回 <!- - --> 评论？

Question

我这里有一个 jsfiddle - http://jsfiddle.net/stevea/QpNbu/3/ - 为所有具有 class='active' 的元素收集 outerHTML。令我吃惊的是，即使我注释掉了一些 HTML，如:

<!--      <div>'Some inner text'</div>  -->

outerHTML 仍然把它带回来!这不可能仍然在 DOM 中，所以我想知道 outerHTML 在哪里。

感谢您的任何见解。

Answer 1

HTML 中的注释令人惊讶，事实上，它是 DOM 的一部分!如果您在此处查看此屏幕截图:

您会看到 google chrome web inspector 将其呈现为 DOM 的一部分(请注意底部栏如何将其显示为 div#box1.active 的子项。)

有关更具体的文档，如果您查看 DOM 节点可能的 Node.nodeType on MDN ，您会看到 COMMENT_NODE 是有效类型之一。

COMMENT_NODE 8

W3还为 DOM 定义了 Comment 接口(interface):

This interface inherits from CharacterData and represents the content of a comment, i.e., all the characters between the starting '<!--' and ending '-->'. Note that this is the definition of a comment in XML, and, in practice, HTML, although some HTML tools may implement the full SGML comment structure.