PHP输出HTML时应通过data属性为JS提供结构化钩子：用data-truncated、data-full-text、data-id等属性传递状态和数据，避免拼接JS代码；截断用mb_substr()并存全文于data-full-text；JS用dataset读取、事件委托绑定、textContent更新，AJAX场景下需配套接口。
PHP输出HTML时怎么让JS知道哪些评论要折叠
关键不是PHP调用JS，而是PHP生成的HTML结构得给JS留好钩子。JS不认PHP变量，只认DOM元素和data属性。
常见错误是直接在PHP里拼接JS代码，比如echo "<script>toggleComment('".$id."')</script>"——这容易XSS，且无法批量控制、响应式差。
- PHP侧只负责输出带
data-truncated="true"和data-full-text的<div class="comment-body"> - 长文本截断用PHP的
mb_substr()（别用substr()，中文会乱码），保留原始完整内容到data-full-text里 - 每个评论块加唯一
data-id，避免JS操作错目标 - 折叠按钮统一用
<button type="button" class="toggle-btn">展开</button>，不写内联onclick
JS怎么安全读取PHP塞进来的data属性
不能依赖innerHTML或innerText去提取“被截断的文本”，因为可能含HTML标签；必须用dataset读data-full-text。
典型翻车点：用el.getAttribute('data-full-text')——它返回字符串但不会自动解码HTML实体，而el.dataset.fullText会自动处理 等，更可靠。
立即学习“PHP免费学习笔记（深入）”；
- 绑定事件用事件委托：
document.addEventListener('click', e => { if (e.target.matches('.toggle-btn')) { ... } })，不用循环绑定 - 判断当前状态看按钮文字还是看
data-truncated值？选后者——文字可能被i18n覆盖，属性值可控 - 替换文本时用
textContent而非innerHTML，防止data-full-text里意外含脚本（哪怕PHP做了htmlspecialchars()，JS层也别冒险）
折叠逻辑里最容易漏掉的边界情况
用户点“展开”后，再点“收起”，按钮文字没变回“展开”，或者高度闪动——大概率是没清掉之前插入的style="height:auto"内联样式，或没重置data-truncated。
- 每次切换都要同步更新三个东西：按钮文字、
data-truncated值、容器的textContent（或innerHTML，如果允许富文本） - 如果评论区支持动态加载（如分页/无限滚动），新插入的DOM不会自动有事件监听，得在插入后重新委托，或确保委托根节点足够高（比如挂到
document） - 移动端双击放大、iOS Safari的
user-select: none可能误伤按钮点击，加-webkit-tap-highlight-color: transparent保响应
PHP侧要不要做服务端折叠判断
要做，但只做一次——在渲染页面时就决定是否默认折叠。别指望JS加载完才决定，那样首屏会闪。
比如评论长度超过200字符就默认折叠，这个阈值PHP和JS得一致，否则JS展开后发现文本比预期短，体验割裂。
- PHP里用
mb_strlen($text, 'UTF-8') > 200判断，JS里用text.length > 200（注意JS的length对UTF-16代理对算2，但中文基本字符都是BMP区，实际和PHP结果一致） - 别把全文存在
data-full-text里传给前端——超长评论（如5万字）会让HTML体积暴涨，应改用AJAX按需加载，此时data-full-text只存空字符串，JS点展开时fetch接口 - 如果用了AJAX，PHP得提供
/api/comment/{id}/full接口，返回JSON，字段名和前端JS约定好，比如{ "content": "..." }
