极客时间返利平台,你可以在上边通过山月的链接购买课程,并添加我的微信 (shanyue94) 领取返现。
每天晚上九点 B站讲解前端工程化直播,并解答相关问题。

# 什么是 HTML 的实体编码 (HTML Entity Encode)

Issue

欢迎在 Gtihub Issue 中回答此问题: Issue 480 (opens new window)

Author

回答者: kglive (opens new window)

  • 不可分的空格: 
  • <(小于符号):&lt;
  • (大于符号):&gt;
  • &(与符号):&amp;
  • ″(双引号):&quot;
  • '(单引号):'&apos;
  • ……

HTML 实体是一段以连字号(&)开头、以分号(;)结尾的字符串。用以显示不可见字符及保留字符 (如 HTML 标签)

在前端,一般为了避免 XSS 攻击,会将 <> 编码为 &lt;&gt;,这些就是 HTML 实体编码。

whatwg (opens new window) 中可查看实体编码数据。

在 HTML 转义时,仅仅只需要对六个字符进行编码: &, <, >, ", ', ```。可使用 he (opens new window) 这个库进行编码及转义

// 实体编码
> he.encode('<img src=""></img>')
< "&#x3C;img src=&#x22;&#x22;&#x3E;&#x3C;/img&#x3E;"

// 转义
> he.escape('<img src=""></img>')
< "&lt;img src=&quot;&quot;&gt;&lt;/img&gt;"
Last Updated: 11/27/2021, 10:11:48 AM