HTML实体在浏览器中呈现的方式不同

Question

我正在学习字符编码，但现在有点混乱。

在下面的代码中，在控制台中我将输出显示为'>'，浏览器将其正确显示为“＆gt; ”。

<div id="test">&gt;</div>
</body>
<script type="text/javascript">
x = document.getElementById("test").innerHTML;
console.log(x);
</script>

但是，如果我使用此实体'℘'代替'>'，我会在控制台中获得渲染输出并在浏览器中。

两个实体之间有什么区别？为什么它在控制台中显示不同？

Answer 1

当您在控制台日志中编写元素时，浏览器会应用W3C HTML5规范第8.3节Serializing HTML fragments中所述的HTML序列化。条款末尾的转义规则指定：

1. 将字符串“&”替换为“&”字符。

2. 将任何出现的U + 00A0 NO-BREAK SPACE字符替换为 字符串“ ”。

3. 如果在属性模式下调用算法，则替换any 字符串“”“”出现“”字符。

4. 如果未在属性模式下调用算法，请替换any 字符串“<”出现“<”字符，以及任何字符 字符串“>”出现“>”字符。

因此，在将元素内容写入日志时，＆符号和不间断空格将呈现为字符引用，其他字符也是如此。当浏览器从HTML标记构造内部表示DOM时，它会用实际的“℘”字符替换引用℘。所有字符引用都会发生类似的操作，包括>，但提到的两个字符都是作为引用呈现的，无论它们在HTML源代码中如何表示。