作者：JavaScript前端（梓超）
注：此文章為頭條號原創，特此聲明！

document.execCommand("copy")

 <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>

ello，大家好，前段時間做舔狗日記小程序，需要一鍵復制，看了下文檔，小程序自帶復制功能，那么網頁js如何實現復制功能呢？

首先，我查了下，貌似可以實現對input和textarea等文本輸入框可以實現選中復制，針對div，p等標簽不可以，那么我們需要新建一個文本框標簽，不能給display:none; 我們需要懟他進行一個定位，讓透明看不見找不到，點擊復制，將需要復制的內容賦值給文本框，接著對文本框進行全選，在進行復制操作即可，代碼如下：

Markup

<p id="content">前端共享博客-專注前端行業精選- sharedblog.cn</p>
<textarea id="text" style="position: fixed;top: 10000px;left: 10000px;opacity: 0;"></textarea>
<button id="CopyBtn">復制</button>

JavaScript

網頁開發中，實現復制功能是一項常見的需求。本文將介紹如何使用JavaScript實現網頁上的復制功能，為您揭秘這一實用技巧。

步驟一：創建復制按鈕

首先，在HTML文件中創建一個按鈕，并設置一個唯一的id，用于后續的處理。

<button id="copyButton">復制文本</button>

步驟二：編寫復制函數

接著，在JavaScript中編寫復制函數，該函數將實現復制功能。

document.getElementById("copyButton").addEventListener("click", function() {
 // 希望復制的文本內容
 var text = "要復制的文本內容";
 // 創建一個元素
 var input = document.createElement("input");
 input.setAttribute("value", text);
 // 將元素追加到頁面中
 document.body.appendChild(input);
 // 選中元素中的文本內容
 input.select();
 // 執行復制操作
 document.execCommand("copy");
 // 移除元素
 document.body.removeChild(input);
 // 顯示復制成功提示
 alert("復制成功！");
});

步驟三：測試程序

我們嘗試運行程度，然后點擊一下復制按鈕；

運行結果：

至此，我們已完成了JavaScript實現網頁復制功能的所有步驟。

在實際運用中，您可以根據需要對復制功能進行改進，例如添加復制成功的提示、處理異常情況等。通過掌握這一技巧，您可以為用戶提供更好的交互體驗。

注意：

請在合適的時機將代碼部署到實際環境中進行測試。

確保在使用execCommand("copy")方法時，瀏覽器攔截器或插件不會阻止復制操作。

部分移動設備瀏覽器可能不支持execCommand方法，因此請根據實際情況進行兼容性處理。