如何避免数据库中的&LT在浏览器中显示为<？

问题本质 #

这是HTML实体双重解析导致的：浏览器先把&解析成&，剩下的&LT（大小写不影响解析）会被进一步解析成<，最终显示为小于号。

解决方案 #

根据实际需求分两种情况处理：

1. 希望浏览器显示原始的&LT文本

• 后端输出处理：生成HTML时，对数据库内容再做一次HTML转义，把所有&替换为&。原内容&LT会变成&LT，浏览器解析后就会显示为&LT。
• 前端框架渲染：如果用Vue、React等框架，别用v-html、dangerouslySetInnerHTML这类直接解析HTML的方式，改用普通文本绑定（比如Vue的{{ 内容 }}、React的{ 内容 }），框架会自动转义实体，阻止浏览器解析。

2. 实际想存储的是<，误存成了&LT（需要显示<而非<）

这种情况是存储时多做了一次转义，要在输出前还原：

• 后端处理：把数据库里的&替换回&，得到&LT（即标准的<实体），输出到HTML后，浏览器会解析成<，符合预期。
• 前端处理：用JS的decodeURIComponent或自定义函数反转义，比如把&替换为&，再插入页面。

内容的提问来源于stack exchange，提问作者Don W.