浏览器如何处理 HTML 中的“<”?

How is "<" in HTML handled by browsers?

在下面的代码片段中,< 在 Firefox 37.0.2 中按预期呈现,我在许多其他现代浏览器中也看到了同样的情况。此文本区域规范是否有效 HTML5?理想情况下不应该是 &lt;通过转义“<”

<html>
<textarea>
Hello World <
</textarea>
</html>

HTML 解析器如何区分标签打开和“<”?大多数浏览器通过猜测自动处理错误,这是一种情况吗?

我对此感兴趣的原因是,当我们在 Web 应用程序中使用 WYSIWYG 编辑器时 - 我们主要从编辑器源中保存 HTML。当我们为前端模板化它时,这种行为使得 HTML 从后端引用东西不是强制性的。它可以在没有 HTML 引用的情况下工作,但它可能会导致不良影响,例如冻结/无限循环至少在 TinyMCE 编辑器的 3.5.8 版本中。

这确实只是猜测。在 HTML 中使用文字 < 的正确方法是使用 &lt;&gt; 用于 >)。

就是说,textarea 有点特殊,因为它永远不能包含任何其他 HTML 元素 - 因此解析器可以确定您的意思是文字 < 而不是开始标签。当然,它分解为 </textarea> :)

来自HTML 4 规格:

第 5.3.2 节:

Authors wishing to put the "<" character in text should use "<" (ASCII decimal 60) to avoid possible confusion with the beginning of a tag (start tag open delimiter). Similarly, authors should use ">" (ASCII decimal 62) in text instead of ">" to avoid problems with older user agents that incorrectly perceive this as the end of a tag (tag close delimiter) when it appears in quoted attribute values.

因此 对于 HTML 4 不是必需的,但这仍然是一个很好的做法。当然,XHTML 和/或 HTML 5 可能更严格一些。

HTML 规范在很多方面实际上是非常不具体的,这对确保浏览器以(或多或少)微妙的方式彼此不兼容大有帮助。你最好的选择是不要依赖所有 HTML 允许 的东西,而只依赖那些非常明确和具体的东西。原因很简单——两个浏览器可以 100% 完全符合 HTML 规范,并且仍然以完全无用的方式处理相同的 HTML。

如果不了解实际代码就很难说,但是常见的 HTML 解析器会在遇到开始标记时尝试找到结束标记。

所有与元素不相似的字符都被打印出来,就好像它们被转义了一样如果你幸运的话!这对于只允许文本的元素来说当然是正确的,比如 <textarea> 在你的样本中。

这是无效的HTML,显然应该避免。

Mozilla HTML 解析器将忽略任何 'less than' 尖括号后没有立即跟上有效的标记类型。 任何白色 space 字符(space、制表符、换行符等)呈现方括号 'not a tag'。 此外,文本区域内的任何内容都只能是文本。

无论有效性如何,HTML5 规范完全定义了精确的解析规则。

当树构造规则遇到 <textarea> 标记时,分词器会切换到 RCDATA state

在该状态下,如果分词器遇到 < 字符,它会切换到 RCDATA less-than sign state

在那种状态下,除非下一个字符是 /,否则它将 < 简单地视为 < 并继续。否则,分词器切换到 RCDATA end tag open state

依此类推,objective 允许解析器检测 </textarea> 标记,但将其他所有内容作为文本传递。

不涉及 "guessing",所有现代浏览器,包括 IE10 之后的 IE 都遵循这些规则。