老的 document.execCommand(copy) 是同步 hack，且必须先选中内容。现代 Clipboard API 异步且权限化：navigator.clipboard.writeText 写入文本，readText 读取；读写富内容用 ClipboardItem 配置 MIME 类型，图片以 Blob 传入。读取属于敏感操作，需要用户授权或文档已聚焦。
复制按钮的通用降级方案：优先 clipboard.writeText，失败时 fallback 到 execCommand。注意 read 在未授权的页面会被拒绝，可先用 navigator.permissions.query 询问状态。手机端对写入限制较松，读取普遍更严格，发布前要在真机验证。
<style> .box { width: 300px; padding: 12px; border: 1px solid #4a9eff; border-radius: 10px; } .box button { border: none; background: #4a9eff; color: #fff; border-radius: 6px; padding: 6px 14px; cursor: pointer; } .tip { margin-top: 8px; color: #888; font-size: 13px; } </style> <div class="box"> <button onclick="copyText()">复制优惠码 VIP2026</button> <div class="tip" id="ct">点击按钮复制文本到剪贴板</div> </div> <script> function copyText() { var tip = document.getElementById('ct'); if (navigator.clipboard) { navigator.clipboard.writeText('VIP2026').then(function () { tip.textContent = '复制成功：VIP2026'; }).catch(function () { tip.textContent = '授权被拒绝'; }); } else { var ta = document.createElement('textarea'); ta.value = 'VIP2026'; document.body.appendChild(ta); ta.select(); document.execCommand('copy'); ta.remove(); tip.textContent = '降级方案复制成功'; } } </script>