js实现点击复制网页内容（基于clipboard.js）

浏览网页过程中会遇到点击复制链接地址的情况，下面就介绍一种实现方法，该方法是基于clipboard.js；

官网地址：https://clipboardjs.com/；

clipboard.js使用比较简单，可通过script直接引入；

步骤1：引入clipboard.js

<script src="clipboard.min.js"></script>

步骤2：html

<!-- Target -->
<span id="foo">哈哈,我被复制了</span>
<!-- Trigger -->
<button class="btn" data-clipboard-target="#foo" data-clipboard-action="copy">复制</button>
<!--剪切时：data-clipboard-action="copy"-->

步骤3：js方法

var clipboard = new ClipboardJS('.btn');
clipboard.on('success', function(e) {
    console.info('Action:', e.action);
    console.info('Text:', e.text);
    console.info('Trigger:', e.trigger);
    alert('复制成功');
    e.clearSelection();
});

clipboard.on('error', function(e) {
    console.error('Action:', e.action);
    console.error('Trigger:', e.trigger);
});

上述简单的三个步骤便可以实现简单的复制内容；

兼容性：

详细参考:https://www.npmjs.com/package/clipboard