无法将 html 格式的字符串复制到 Chrome 中的剪贴板答案

【问题标题】：Cannot copy html formatted string to clipboard in Chrome无法将 html 格式的字符串复制到 Chrome 中的剪贴板
【发布时间】：2019-07-07 04:54:02
【问题描述】：

我在 angular5 上工作，我必须从 clipboard 复制一些 HTML 代码并将其粘贴到 Outlook 中。我已经为 IE 实现了这一点，但相同的代码在 chrome 中不起作用，chrome 根本不会复制任何内容，也不会显示任何控制台错误。

基本上，一旦我复制，我必须创建一个hyperlink 并在 Outlook 中越过该超链接，当用户单击该链接时，应打开一个带有该超链接引用的新页面。我的代码如下，请帮我实现chrome的复制功能？

public copyToClipboard {
  const body = document.createElement('body');
  const breakLine = document.createElement('br');
  const ol = document.createElement('ol');

  const range = document.createRange();
  document.body.appendChild(body);
  body.appendChild(ol);

  let name: string;
  this.selectedFiles.forEach(doc => {
    const docURL = this.serviceCall();
    const anchor = document.createElement('a');
    const li = document.createElement('li');

    anchor.href = docURL;
    anchor.text = doc.fileName;
    name = doc.name;
    body.appendChild(li).appendChild(anchor);
   });
    range.selectNode(body);

    window.getSelection().addRange(range);
    document.execCommand('copy');
    document.body.removeChild(body);
}

//HTML
<button pButton (click)="copyToClipboard()"></button>

（请忽略我的代码中是否有任何拼写错误，因为我输入的是代码而不是复制+粘贴，此代码在 IE 中运行完美）

【问题讨论】：

什么时候调用？还有任何使用标签的理由吗？听起来有点自找麻烦。
我已经更新了关于如何调用它的问题。没有使用的具体原因。这是我第一次尝试的方法，所以我没有玩弄代码。对此有什么建议，我应该尝试其他方法吗？
好吧，body 元素的唯一授权父级是 html 元素。大多数浏览器都允许您在文档的其他位置附加另一个，但您可能会遇到一些问题，这些问题不能真正被视为浏览器错误。而且从快速测试来看，这似乎确实是您当前的问题（这仍然是相当令人惊讶的 TBH）。例如，尝试用
替换它。
@Kaiido 我试着用 div 替换 body 像这样 'const body = document.createElement('div');'但阿拉斯仍然无法在 chrome 中工作——