求兼容多浏览器的window.clipboardData.setData代码及跨浏览器适配协助

Hey，我知道IE特有的window.clipboardData.setData在现代浏览器里根本用不了，所以专门整理了这套跨浏览器替代方案，覆盖从旧版IE到最新Chrome、Firefox、Safari的所有主流场景：

完整实现代码 #

function copyToClipboard(text) {
    // 兼容IE10及以上版本
    if (window.clipboardData && window.clipboardData.setData) {
        return window.clipboardData.setData('Text', text);
    }
    // 支持标准Clipboard API的现代浏览器（推荐方案）
    else if (navigator.clipboard && navigator.clipboard.writeText) {
        return navigator.clipboard.writeText(text)
            .then(() => true)
            .catch(err => {
                console.error('剪贴板写入失败:', err);
                return false;
            });
    }
    // 降级兼容旧版现代浏览器（如Chrome 60前、Firefox 57前）
    else {
        // 创建临时textarea用于承载文本
        const textarea = document.createElement('textarea');
        textarea.value = text;
        // 隐藏元素避免干扰页面布局
        textarea.style.position = 'absolute';
        textarea.style.left = '-9999px';
        textarea.style.top = '-9999px';
        document.body.appendChild(textarea);
        
        // 选中文本并执行复制
        textarea.select();
        try {
            const success = document.execCommand('copy');
            document.body.removeChild(textarea);
            return success;
        } catch (err) {
            console.error('降级复制方案失败:', err);
            document.body.removeChild(textarea);
            return false;
        }
    }
}

代码细节拆解 #

• IE专属分支：直接调用IE原生的window.clipboardData.setData，只需要传入'Text'类型和目标文本即可，专门适配IE10+（IE9及以下基本已退出主流场景，若需兼容可单独沟通）。
• 现代浏览器主方案：使用W3C标准的navigator.clipboard.writeText API，这是当前浏览器推荐的异步剪贴板操作方式，返回Promise便于处理成功/失败状态。
• 降级兼容方案：针对不支持标准API的旧版浏览器，通过创建临时隐藏textarea、选中内容后调用execCommand('copy')实现复制，虽然部分浏览器标记该API为弃用，但目前仍能正常工作。

关键注意事项 #

• 必须在用户交互中触发：所有浏览器的剪贴板操作都有安全限制，只能在点击、按键等用户主动交互事件内调用该函数（比如绑定在按钮点击事件上），否则会被浏览器拦截。
• 异步处理：由于标准Clipboard API是异步的，调用时可以用await或者.then()来处理结果，示例如下：

使用示例 #

// 给按钮绑定复制功能
document.getElementById('copyButton').addEventListener('click', async () => {
    const targetText = '这是要复制到剪贴板的内容';
    const isSuccess = await copyToClipboard(targetText);
    
    if (isSuccess) {
        alert('复制成功！');
    } else {
        alert('复制失败，请手动复制内容');
    }
});

内容的提问来源于stack exchange，提问作者mpatino