element.progress 不生效是因为只改 style.width 而不更新 lay-percent 属性和重绘文本，尤其开启 lay-showPercent="true" 时数字卡住；需同步执行 attr('lay-percent')、element.init() 和 element.progress() 三步。
直接调用 element.progress 为什么经常不生效
不是你写错了，而是 element.progress 只改 style.width，不更新 lay-percent 属性，也不重绘百分比文本。尤其开启 lay-showpercent="true" 后，你看到的数字还是旧的——因为 dom 属性没变，element.init() 没被触发。
常见现象包括：进度条宽度动了但右上角/内部数字卡住、第二次调用完全没反应、传 "2/5" 这类分数直接静默失败（element.progress 不解析分数，只认 "40%" 或数字加 %）。
- 必须同步三步：
$().attr('lay-percent', '75%')→element.init()→element.progress('filter', '75%') - 不要在表格
templet里调element.progress，它依赖 DOM 初始化时机，而表格渲染是批量静态插入 -
lay-filter值必须唯一且与 JS 调用时一致，大小写敏感
表格单元格内进度条该怎么做
放弃 layui.progress，用原生 <div> + CSS 动画。因为 <code>table.render 把 templet 返回内容当纯 HTML 插入，不会触发 element.render('progress')，更无法启动内部定时器。
实操要点：
- 列配置中用
templet: function(d) { return '<div class="progress-wrap"><div class="layui-progress-bar" data-id="' + d.id + '" style="width: ' + (d.rate || 0) + '%"></div></div>'; } - CSS 必须含
overflow: hidden和固定高度，否则动画溢出或塌陷 - 后续更新只走
document.querySelector('[data-id="1001"] .layui-progress-bar').style.width = '82%'，不调任何 layui 方法
大号进度条（layui-progress-big）显示百分比失败的原因
不是样式问题，是属性缺失或值无效。lay-showPercent 必须存在且非 false/no，支持 "true"、"yes"、"1" 等真值，但不能写成 lay-showpercent（注意大小写）。
分数写法如 lay-percent="1/3" 只在初始 HTML 中有效，运行时不能传给 element.progress()；需自行换算为百分比字符串再设属性。
- 初始 HTML 可写
<div class="layui-progress-big" lay-showpercent="true"><div class="layui-progress-bar" lay-percent="1/3"></div></div> - 动态更新时：先
$.attr('lay-percent', '33.33%')，再element.init()，最后element.progress('filter', '33.33%') - 如果用了
layui-progress-big却没文字，先检查控制台是否报elem is not defined，大概率是lay-filter没配或选择器找不到对应元素
WebSocket 或轮询场景下如何安全更新多条进度
别用数组索引定位 DOM，分页、排序、搜索都会打乱顺序。必须靠数据本身唯一字段（如 d.id）绑定和查找。
关键动作只有两行：
- templet 里给进度容器加
data-id="' + d.id + '" - 收到新数据后执行：
const bar = document.querySelector('[data-id="1001"] .layui-progress-bar'); if (bar) bar.style.width = '92%';
如果页面有多个进度条，且 ID 可能重复（比如跨页），建议拼接业务前缀，例如 data-id="upload-1001"，避免冲突。
