navigator.clipboard.writeText()需用户手势同步调用，否则报“Permission denied”；Safari等旧浏览器需降级execCommand；仅支持字符串，注意清理空白与换行；成功后应提供UI反馈。
点击按钮触发 navigator.clipboard.writeText() 报错 “Permission denied”
浏览器不会在任意时机允许写入剪贴板，必须由用户手势（如 click、keydown）直接触发，且调用需在事件处理函数同步执行——不能包裹在 setTimeout、Promise.then 或异步回调里。否则会抛出 NotAllowedError: Write permission denied。
实操建议：
- 确保按钮绑定的是原生
click事件，且 handler 内直接调用navigator.clipboard.writeText(text) - 避免解构赋值后间接调用，例如
const { writeText } = navigator.clipboard; writeText(text);在部分 Chrome 版本中会失败 - 不要在
useEffect（React）或mounted（Vue）等生命周期钩子中预调用，必须等用户真实点击
navigator.clipboard 在 Safari 和旧版 Edge 中不可用
Firefox 63+、Chrome 66+、Edge 79+、Safari 13.1+ 支持 navigator.clipboard，但 Safari 13.0 及更早版本只支持 document.execCommand('copy') 回退方案；iOS Safari 直到 16.4 才完全支持 writeText，且要求页面在前台、非 iframe 沙箱环境。
实操建议：
- 先检测可用性：
if ('clipboard' in navigator)，否则降级用document.execCommand - 降级时需将文本写入临时
<textarea>并选中，再调用execCommand('copy')；注意该 API 已废弃但目前仍被广泛支持 - 对 iOS 用户，避免依赖剪贴板写入做关键流程（如验证码复制），因其可能静默失败
复制中文、换行符或富文本内容失败
navigator.clipboard.writeText() 只接受字符串，不支持 HTML 或图片。若传入含换行符的字符串（\n），在某些终端或编辑器中可能显示异常；中文本身无问题，但若源字符串被意外截断或编码错误（如从 innerText 读取时含空格/换行），会导致复制结果不符预期。
实操建议：
- 复制前用
.trim()清理首尾空白，必要时用.replace(/\s+/g, ' ')规范空白符 - 换行符可保留，但需确认目标应用是否支持（如微信 PC 版粘贴时会丢弃
\n，而 VS Code 正常识别） - 不要尝试传入
DOMString以外的类型，比如writeText(element)会报TypeError
复制成功后没反馈，用户不知道是否生效
API 本身不提供 UI 反馈，writeText() 返回 Promise，resolve 表示写入系统剪贴板成功，但不保证用户随后能粘贴——比如系统剪贴板被其他程序清空，或用户切换了设备。
实操建议：
- 在
.then()中更新按钮文案（如 “已复制”），并加个短暂复位（setTimeout(() => { btn.textContent = '复制'; }, 2000)） - 避免仅靠 console.log 调试，移动端看不到控制台；也不要依赖 alert，它会中断用户操作流
- 如果需要更高可靠性，可追加一次
navigator.clipboard.readText()（需额外权限）校验，但多数场景没必要
writeText 的上下文限制：即使在 click 里调用，若按钮是通过 JS 动态插入且未正确 focus，或页面刚从后台切回，仍可能失败。遇到时优先检查是否满足“用户手势 + 同步调用 + 页面可见”三要素。 
