js实现复制

使用 document.execCommand 方法（传统方法，已逐渐淘汰）

此方法兼容旧版浏览器，但现代浏览器可能逐步弃用。
通过创建临时 textarea 或 input 元素，选中文本后执行复制命令：

function copyText(text) {
  const textarea = document.createElement('textarea');
  textarea.value = text;
  document.body.appendChild(textarea);
  textarea.select();
  document.execCommand('copy');
  document.body.removeChild(textarea);
}

// 调用示例
copyText('需要复制的文本');

使用 Clipboard API（现代推荐方式）

通过 navigator.clipboard.writeText() 实现，需注意浏览器权限（通常需用户触发事件如点击）：

async function copyText(text) {
  try {
    await navigator.clipboard.writeText(text);
    console.log('复制成功');
  } catch (err) {
    console.error('复制失败:', err);
  }
}

// 调用示例（需在用户交互事件中触发）
button.addEventListener('click', () => copyText('Hello'));

兼容性处理方案

结合两种方法，优先尝试 Clipboard API，失败后降级到传统方法：

async function copyText(text) {
  try {
    if (navigator.clipboard) {
      await navigator.clipboard.writeText(text);
    } else {
      const textarea = document.createElement('textarea');
      textarea.value = text;
      document.body.appendChild(textarea);
      textarea.select();
      document.execCommand('copy');
      document.body.removeChild(textarea);
    }
    console.log('复制成功');
  } catch (err) {
    console.error('复制失败:', err);
  }
}

注意事项

• 用户交互触发：大多数浏览器要求复制操作由用户点击等手势触发，否则可能被阻止。
• HTTPS 环境：Clipboard API 在部分浏览器中仅限安全上下文（HTTPS）。
• 错误处理：捕获并处理权限拒绝等异常情况。