JS实现一键复制

原生js
浏览器提供了copy命令 ，可以复制选中的内容document.execCommand("copy")。如果是输入框，可以通过 select() 方法，选中输入框的文本，然后调用copy 命令，将文本复制到剪切板，但是 select() 方法只对<input> 和 <textarea> 有效，如果需要对其他元素进行复制，可以考虑在页面添加一个隐藏的textarea，同步下两个元素的值即可。

• 优点:
  原生js,不依赖第三方插件

• 缺点:
  mac下不兼容

• 实现:

<!-- 文本所在的代码块 -->
<div id='textDiv' >text you want to copy</div>

<!-- 隐藏的文本域用来同步选中需要复制的文本 -->
<textarea id='textArea' style='display: none'></textarea>

<!-- 复制按钮 -->
<input type='button' id='copyBtn' onclick='copyText()'/>

<script>
var copyText = function() {
    // 同步文本
    var text = document.getElementById('textDiv').innerText
    var textArea = document.getElementById('textArea')
    textArea.value = text
    // 选中文本
    textArea.select()
    // 复制
    document.execCommand('copy')
}

</script>

•