最近遇到一个需求，需要点击按钮，复制

标签中的文本到剪切板

之前做过复制输入框的内容，原以为差不多，结果发现根本行不通

尝试了各种办法，最后使了个障眼法，实现了下面的效果

一、原理分析

浏览器提供了 copy 命令 ，可以复制选中的内容

如果是输入框，可以通过 select() 方法，选中输入框的文本，然后调用 copy 命令，将文本复制到剪切板

但是 select() 方法只对 和 有效，对于 <p> 就不好使</p> <p>最后我的<a href="https://www.jb51.cc/tag/jiejuefang/" target="_blank" class="keywords">解决方</a>案是，在<a href="https://www.jb51.cc/tag/yemian/" target="_blank" class="keywords">页面</a>中<a href="https://www.jb51.cc/tag/tianjia/" target="_blank" class="keywords">添加</a>一个 <textarea>，然后把它隐藏掉</p> <p><h3>点击按钮的时候，先把 <textarea> 的 value 改为 <p> 的 innerText，然后复制 <textarea> 中的<a href="https://www.jb51.cc/tag/neirong/" target="_blank" class="keywords">内容</a></h3></p> <p><h3>二、<a href="https://www.jb51.cc/tag/daima/" target="_blank" class="keywords">代码</a>实现</h3></p> <p>HTML 部分</p> <div class="jb51code"> <pre class="brush:xhtml;"> <style type="text/css"> .wrapper {position: relative;} #input {position: absolute;top: 0;left: 0;opacity: 0;z-index: -10;} </style> <p><div class="wrapper"><br /> <p id="text">我把你当兄弟你却想着复制我？</p><br /> <textarea id="input">这是幕后黑手
<button onclick="copyText()">copy