一、原理分析
浏览器提供了 copy 命令 ，可以复制选中的内容
document.execCommand("copy")
如果是输入框，可以通过 select() 方法，选中输入框的文本，然后调用 copy 命令，将文本复制到剪切板
但是 select() 方法只对 <input> 和 <textarea> 有效，对于 <p> 就不好使
最后我的解决方案是，在页面中添加一个 <textarea>，然后把它隐藏掉
点击按钮的时候，先把 <textarea> 的 value 改为 <p> 的 innerText，然后复制 <textarea> 中的内容
二、代码实现
HTML 部分
按 Ctrl+C 复制代码
按 Ctrl+C 复制代码
JS 部分
<script type="text/javascript">
function copyText() {
var text = document.getElementById("text").innerText;
var input = document.getElementById("input");
input.value = text; // 修改文本框的内容
input.select(); // 选中文本
document.execCommand("copy"); // 执行浏览器复制命令
alert("复制成功");
}
</script>
亲测，Firefox 48.0，Chrome 60.0，IE 8 都能用
相关推荐
-
js中深浅拷贝（js深拷贝和浅拷贝的方法）
在js中，数据类型分两种: ‘基本数据类型’ 和 ‘引用数据类型’ ‘基本类型数据’ 存在于 栈内存 中，'引用数据类型’ 的属性存在于 栈内存中，值存在与 堆内存中，通过指针来指向对应值 所以，深浅拷贝主要出现在引用数据...
-
javascript特效代码大全（javascript特效代码大全下载分享）
在网页制作中，总是需要用到各种JavaScript特效，有页面特效，时间日期特效、Cookie脚本特效、按钮特效等，不胜枚举，而现在很多人为了提升工作效率，总是会收集一些代码特效素材，在需要的时候，可以快速进行应用。...
-
字节截取字符串（JavaScript截取字符串）
字符串的截取在不同的编程语言中有着不同的方式和表现形式，本文我们就一起来学习在JavaScript截取字符串。 在JavaScript中常用的字符截取函数有slice()、substring()、substr()3个，我们将从这三个函数出发，看看在...
-
js中数组去重常用方法（js数组去重的9种高阶方法分享）
一般的方法此处也不列举了，还是有很多的，如双层循环判断是否相等，或新建数组比较再push等等，需要注意的是，使用splice方法移除元素时，有可能会导致数组塌陷问题，需要处理一下 本文中介绍了多种数组去重的方法...
-
分享json是什么意思（json教程）
本节重点来介绍一下JSON，JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式，我们称之为JavaScript对象表示法。也就是说，JSON是一种格式。首先搞清楚三个概念，即什么是JSON字符串，什么是JavaScript...
-
js导出功能（js文件导入导出）
在 Web 的早期，网站主要由HTML和CSS组成。如果将任何 JavaScript 加载到页面中，它通常以小片段的形式提供效果和交互性。因此，JavaScript 程序通常编写在一个文件中并加载到一个script标签中。开发人员可以将 Java...