使用clipboard.write复制HTML邮件至Outlook时锚链接被追加about:blank问题

当你把剪贴板中的HTML粘贴到Outlook（或Word）时，锚链接被转换为about:blank#id1是因为Word的渲染引擎会为无上下文的HTML锚点添加默认基URL。以下是几种可行的解决方法：

方法一：使用Word兼容的书签标记 #

Word和Outlook原生识别<a name="xxx">形式的书签，你可以在目标元素中添加这个标记，同时保留原有的id属性来确保兼容性：

const copy = `<div>
      <div><a href="#id1">click here</a></div>
      <div>a</div>
      <div>...</div>
      <div id="id1"><a name="id1"></a>a</div>
    </div>`;

粘贴后，Outlook会识别这个书签，点击链接能正常跳转到目标位置。

方法二：添加完整HTML结构与基础URL #

给复制的HTML包裹完整的<html>和<body>标签，并通过<base>指定一个占位基URL，让锚链接基于该URL生成，避免被替换为about:blank：

const copy = `<html>
<head>
  <base href="https://placeholder.com/">
</head>
<body>
  <div><a href="#id1">click here</a></div>
  <div>a</div>
  <div>...</div>
  <div id="id1">a</div>
</body>
</html>`;

注意：部分Outlook版本可能会忽略<base>标签，建议结合方法一一起使用，提升兼容性。

额外注意事项 #

• 确保复制的HTML代码符合Word/Outlook的渲染规范，避免使用过于复杂的现代HTML特性，这类内容可能被过滤或解析异常。
• 测试时直接在Outlook中粘贴并发送给自己，查看实际效果——草稿视图的渲染可能和最终发送后的显示存在差异。

内容的提问来源于stack exchange，提问作者Andrea Disarò