layui表格默认对字段值html转义,富文本需用{{{d.content}}}跳过转义且必须配合声明模板;escape: false可替代但仅适用于可信数据源,xss防护须由后端净化或前端dompurify白名单过滤。

layui table 默认会对所有字段值做 HTML 转义,所以富文本内容(如 <strong>审核通过</strong>)会原样显示为字符串,而不是渲染成加粗文字。这不是 bug,是安全机制;绕过它必须显式控制转义行为,且不能牺牲 XSS 防护。
templet 里用三重大括号 {{{d.content}}} 才能跳过转义
Layui 的模板语法中,{{=d.content}} 会触发 layui.util.escape(),把 变成 <code><;只有 {{{d.content}}}(三个左花括号)才会原样输出,不转义。
- 必须配合
<script type="text/html"></script>声明模板,写在<div> 或直接内联字符串里都无效 <li> <code>templet: '#myTpl'中的#myTpl必须指向一个已静态存在于 DOM 中的<script></script>元素,JS 动态插入的会被忽略 - 如果后端返回的是未过滤的富文本(含
<img src="xss">),光靠{{{}}就等于开后门——务必先净化 - 推荐在前端用
DOMPurify.sanitize(d.content, {ALLOWED_TAGS: ['strong', 'em', 'span', 'br']})白名单过滤 - 更稳妥的做法是在后端(如 .NET 或 Node.js)就完成净化,再传给前端,避免客户端篡改绕过
- 别用正则手动删标签(如
.replace(/]+>/g, '')),容易漏掉注释、CDATA、属性里的 JS 等攻击向量
服务端或前端必须先用 DOMPurify.sanitize() 过滤内容
直接把用户输入的富文本塞进 {{{d.content}}} 是高危操作。Layui 不负责内容安全,只负责模板执行。
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图,自动匹配视觉风格。触发场景:文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
列配置加 escape: false 是替代方案,但仅适用于简单 HTML
如果你不用 templet,而是想让某字段直接渲染 HTML,可在列定义里设 escape: false:
cols: [[
{field: 'content', title: '详情', escape: false}
]]
但这只对纯字段值生效,不支持逻辑判断或结构拼接;而且依然没解决 XSS,所以只适合内部可信数据源(如 CMS 后台自己生成的 label 列表)。
-
escape: false是列级配置,不是表格级,别错放到table.render()的顶层参数里 - 若字段本身是空值或
null,escape: false仍会输出空字符串,不会报错,但可能影响样式对齐 - 和
templet互斥:一旦用了templet,escape配置就失效,控制权完全交给模板写法
真正难的不是怎么让 HTML 显示出来,而是判断哪些标签该留、哪些必须砍、谁来负责净化——后端传来的 d.content 如果已经混入了 onerror 或 javascript:,{{{}}} 就是放大器,不是渲染器。










