如何获取用户复制式元素innerText？JS触发复制事件获取内容

一、获取与手动复制一致的文本（无剪贴板篡改场景） #

如果只是要拿到和用户手动选中复制完全一致的文本，直接用innerText可能会因为浏览器对换行、空格的处理差异导致结果不同，更可靠的方式是模拟用户选中元素内容，然后读取选中的文本：

// 目标元素
const targetEl = document.querySelector('#your-element');

// 创建选区并选中元素内容
const range = document.createRange();
range.selectNodeContents(targetEl);
const selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);

// 获取选中的文本（和手动复制结果一致）
const copiedText = selection.toString();

// 取消选中状态
selection.removeAllRanges();

console.log(copiedText);

selection.toString()会遵循浏览器的文本选择规则，包括保留元素内的换行、连续空格等格式，比innerText更贴近手动复制的效果。

二、捕获页面修改后的剪贴板内容（含表情等额外内容） #

如果页面监听了copy事件并篡改了剪贴板内容（比如自动添加表情），可以通过以下两种方式获取最终的复制内容：

方法1：监听copy事件捕获修改结果 #

const targetEl = document.querySelector('#your-element');

// 选中元素内容
const range = document.createRange();
range.selectNodeContents(targetEl);
const selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);

let finalText = '';
// 监听copy事件，获取页面修改后的内容
document.addEventListener('copy', function handleCopy(e) {
  finalText = e.clipboardData.getData('text/plain');
  // 移除监听避免重复触发
  document.removeEventListener('copy', handleCopy);
});

// 触发复制操作
document.execCommand('copy');

// 取消选中
selection.removeAllRanges();

// 此时finalText就是页面修改后的带表情的内容
console.log(finalText);

方法2：使用现代Clipboard API（需安全上下文） #

仅适用于HTTPS或localhost环境，代码更简洁：

const targetEl = document.querySelector('#your-element');

// 选中元素内容
const range = document.createRange();
range.selectNodeContents(targetEl);
const selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);

// 触发复制后读取剪贴板
navigator.clipboard.writeText(selection.toString())
  .then(async () => {
    const finalText = await navigator.clipboard.readText();
    console.log(finalText); // 获取页面修改后的内容
    selection.removeAllRanges();
  })
  .catch(err => {
    console.error('剪贴板操作失败:', err);
    selection.removeAllRanges();
  });

注意事项 #

如果页面的copy事件监听通过event.isTrusted判断是否为用户手动操作（该属性只读，无法伪造），那么模拟触发的复制可能不会触发篡改逻辑，这种情况下无法获取到带表情的内容。

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