JS 如何复制文本到剪贴板？

Question

JS 如何复制文本到剪贴板？

仓乃文 · Accepted Answer

复制文本到剪贴板在现代浏览器中使用 navigator.clipboard API 一行搞定，无需引入第三方库，比旧方案 document.execCommand 更安全可靠。

现代方案（推荐）：
```javascript
async function copyText(text) {
  try {
    await navigator.clipboard.writeText(text);
    console.log("复制成功");
  } catch {
    console.log("复制失败，可能没有权限");
  }
}

copyText("Hello World");
```

兼容旧浏览器的方案：
```javascript
function copyText(text) {
  const textarea = document.createElement("textarea");
  textarea.value = text;
  textarea.style.position = "fixed";
  textarea.style.opacity = "0";
  document.body.appendChild(textarea);
  textarea.select();
  document.execCommand("copy");
  document.body.removeChild(textarea);
}
```

补充说明：
- navigator.clipboard 需要 HTTPS 或 localhost 环境
- 首次调用会请求用户授权，用户拒绝后 catch 捕获错误
- clipboard API 还支持 write 写入图片等富文本数据
- document.execCommand("copy") 已废弃但仍广泛兼容，作为降级方案
- iOS Safari 需要用户交互触发（如点击按钮），不能在异步回调中调用