优先用textContent改纯文本，安全高效；插入HTML结构时用createElement+appendChild组合，避免innerHTML隐患；确保DOM加载完成后再操作，防止找不到元素或事件丢失。

直接改 innerHTML 最快，但有安全和性能隐患；真要动态更新内容，优先用 textContent、createElement + appendChild 组合。

怎么安全地替换一段文字内容

如果只是改纯文本（比如标题、提示语），别碰 innerHTML —— 它会重新解析 HTML，可能执行意外脚本，还会清空已绑定的事件监听器。

• 用 textContent：只改文字，不解析 HTML，速度快，无 XSS 风险
• 用 innerText：受 CSS 影响（比如 display: none 的元素不参与），且有兼容性差异，一般不用
• 示例：document.getElementById('title').textContent = '新标题';

怎么插入带标签的新内容

需要插入结构（比如加个

...

• 避免拼接字符串后赋给 innerHTML，尤其内容来自用户输入或 API
• 推荐流程：document.createElement('div') → el.textContent = ... 或 el.appendChild(...) → parent.appendChild(el)
• 若必须用 innerHTML（如渲染富文本预览），先用 DOMPurify.sanitize(htmlStr) 过滤

为什么 getElementById 找不到元素

不是语法错，大概率是脚本执行

• 确保代码在 DOMContentLoaded 事件后运行：document.addEventListener('DOMContentLoaded', () => { /* 操作DOM */ });
• 或者把 标签放在