在业务中遇到需求需要复制内容，那么就需要访问操作系统的clipboard，但是其实浏览器对此做了限制，根本的原因在于如果浏览器的script能随意访问操作系统的clipboard，那么很多用户的个人数据和敏感数据就会泄露，因为脚本可以收集起来然后发送到远程的服务器上
security
但是现在，浏览器支持基本的clipboard功能，但是作出了一定的限制
- 大多数浏览器支持，但是Mac上的safari和IOS不支持
- Support varies across browsers无法跨浏览器提供完整的功能
- 必须由用户触发，click或者press keyboard事件，script不能随意的在任意事件使用clipboard
使用 document.execCommand('copy') API
实现复制的API是document.execCommand('copy')，在使用之前，我们一般需要判断浏览器支持不支持，主要有两个API来使用document.queryCommandSupported('copy')
和document.queryCommandEnabled('copy')
，但是在Chrome中，第一个API返回true，第二个API返回false，所以更常用的方法是
try {
document.execCommand('copy')
} catch(err) {
// handle error
}
下一步，我们要怎样让用户去复制呢？我们首先需要高亮文本内容，可以使用HTMLInputElement.select()，即input和textarea的select()方法来高亮文本，然后再由用户的一个事件来触发document.execCommand('copy')
Chrome和FF支持使用range对象来复制任意节点，主要思路就是使用getSelection()API来高亮元素的内容，然后使用document.execCommand('copy')来复制
clipboard.js
比较成熟的跨浏览器方案是使用clipboard.js，提供的API可以复制input和textarea的内容，也可以复制元素自定义属性的内容
<button class="btn" data-clipboard-text="Just because you can doesn't mean you should — clipboard.js">
Copy to clipboard
</button>
用户只要点击了就能复制data-clipboard-text中的内容
reference
How do I copy to the clipboard in JavaScript?
Copy to Clipboard that also works on Mobile?
这篇文章比较完整的解释了clipboard的历史和使用方法
Roll Your Own Copy to Clipboard Feature in 20 Lines of JavaScript
