四种实现剪贴板的操作
- 原生
document.execCommand()方法 - 异步的 Clipboard API
-
copy事件和paste事件 - 第三方库 clipboard.js
前三个的详细内容可以查阅阮一峰老师的剪贴板操作 Clipboard API 教程。我们来看看第四种使用 clipboard.js 库简化原生操作。
第三方库 Clipboard.js
首先，在我们的项目中使用 NPM 引入 clipboard：
$ npm i clipboard
或者使用 CDN：
Clipboard.js 的文档已经很全面了，以下是一些简单的实例。
复制文本
通过 data-clipboard-target 绑定相对应的 id 进行匹配：
更简便的方法是，使用 data-clipboard-text 属性设置您想包含的内容即可。
剪切文本
定义 data-clipboard-action 属性，以指定是要 copy 还是 cut 内容。
注意：
cut操作仅适用于或