JS实现内容复制功能
要在JavaScript中实现内容复制功能，你可以使用document.execCommand()方法或Clipboard API。下面我将为您提供两种实现方法的示例代码，同时满足您的各种要求。
方法一：使用document.execCommand()
// 创建一个按钮，点击它来触发复制功能
var copyButton = document.createElement("button");
copyButton.innerText = "复制文本";
document.body.appendChild(copyButton);
// 将要复制的文本内容存储在一个变量中
var textToCopy = "这是要复制的文本内容";
// 绑定点击事件处理程序，触发复制操作
copyButton.addEventListener("click", function() {
// 创建一个临时的textarea元素来容纳文本
var textarea = document.createElement("textarea");
textarea.value = textToCopy;
document.body.appendChild(textarea);
textarea.select();
// 使用document.execCommand('copy')方法执行复制操作
var successful = document.execCommand('copy');
// 从DOM中移除临时的textarea元素
document.body.removeChild(textarea);
// 检查复制是否成功
if (successful) {
alert("文本已成功复制到剪贴板");
} else {
alert("复制操作失败，请手动复制文本");
}
});方法二：使用Clipboard API
// 创建一个按钮，点击它来触发复制功能
var copyButton = document.createElement("button");
copyButton.innerText = "复制文本";
document.body.appendChild(copyButton);
// 将要复制的文本内容存储在一个变量中
var textToCopy = "这是要复制的文本内容";
// 绑定点击事件处理程序，触发复制操作
copyButton.addEventListener("click", function() {
// 使用Clipboard API将文本复制到剪贴板
navigator.clipboard.writeText(textToCopy)
.then(function() {
alert("文本已成功复制到剪贴板");
})
.catch(function(err) {
console.error("复制操作失败: " + err);
alert("复制操作失败，请手动复制文本");
});
});这两种方法都可以在点击按钮时将指定文本内容复制到剪贴板。第一种方法使用document.execCommand()，而第二种方法使用现代的Clipboard API。Clipboard API更加强大且推荐使用，但需要浏览器支持。根据您的需求和浏览器兼容性，可以选择其中一种方法来实现内容复制功能。这两种方法都很简单易懂，用户点击按钮后会收到相应的反馈。
