原生js实现复制功能

77 阅读1分钟

完整代码:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
    <script>
      function copy() {
        const txt = document.getElementById("code").innerText
        // 添加一个input元素放置需要的文本内容
        const dataContainer = document.createElement('input');
        dataContainer.value = txt;
        document.body.appendChild(dataContainer);
        // 选中并复制文本到剪切板
        dataContainer.select();
        document.execCommand('copy');
        // 移除input元素
        document.body.removeChild(dataContainer);
        alert('复制成功');
      }
    </script>
    <title>标题</title>
  </head>
  <body>
    <p><span id="code">999999</span><button onclick="copy()">复制</button></p>    
  </body>
</html>

vscode提示'document.execCommand' is deprecated,有时间了再详细了解