JavaScript剪贴板交互主要通过Clipboard API实现，需用户手势触发且要求HTTPS；writeText()和readText()用于纯文本读写，返回Promise；富文本或图片需用write()/read()配合ClipboardItem；现代浏览器广泛支持但存在兼容性差异。
JavaScript 中的剪贴板交互现在主要通过 Clipboard API 实现，它比旧的 document.execCommand('copy') 更安全、更可控，且无需依赖输入框或选中内容。核心是 navigator.clipboard 对象，但需注意权限和使用场景。
基础用法：复制文本到剪贴板
调用 navigator.clipboard.writeText() 即可写入纯文本。该方法返回 Promise，成功则无返回值，失败会抛出错误。
try {
await navigator.clipboard.writeText('Hello, Clipboard!');
console.log('复制成功');
} catch (err) {
console.error('复制失败:', err);
}
});
读取剪贴板中的文本
使用 navigator.clipboard.readText() 获取当前剪贴板文本内容，同样返回 Promise。
- 需要用户主动触发（如点击“粘贴”按钮），不能自动读取
- 部分浏览器（如 Safari）可能要求额外权限或仅支持安全上下文下的显式请求
- 注意：读取操作可能被用户拒绝，务必处理 Promise rejection
读写富文本或图片（进阶）
writeText() 和 readText() 只处理纯文本。如需复制 HTML、图片等，需用更底层的 write() 和 read() 方法。
立即学习“Java免费学习笔记（深入）”；
-
write()接收一个ClipboardItem数组，每个项可包含多种 MIME 类型数据（如'text/html'、'image/png'） - 写入图片需先获取 Blob（例如从
<canvas>导出），再构造ClipboardItem - 读取非文本内容需检查
types并调用getType()获取对应 Blob
权限与兼容性注意事项
Clipboard API 在现代浏览器中已广泛支持（Chrome 66+、Firefox 63+、Edge 79+、Safari 16.4+），但仍有细节差异：
- 首次调用读/写前，浏览器可能弹出权限提示（尤其在非安全上下文或跨源 iframe 中）
- Safari 对
read()的限制较严，建议优先使用readText()并降级处理 - 可提前检测支持性：
if ('clipboard' in navigator) - 对旧版浏览器，可保留
execCommand作为 fallback（需临时创建<textarea>并选中）
