向未附加DOM节点插入未净化HTML是否安全？附文本提取实现问询

你的实现部分满足安全要求，但在资源请求环节存在隐患，以下针对你提出的三个安全点逐一说明：

1. HTML中包含的脚本不会运行 #

✅ 安全。
通过document.createElement('div')创建的是内存中的离线元素，从未挂载到当前文档的DOM树中。这种情况下：

• 内嵌或外部引入的<script>标签不会被浏览器执行；
• 内联事件属性（如onclick、onerror）也没有触发的上下文，不会执行对应的代码。

2. 所有内联样式表不会影响当前文档 #

✅ 安全。
这个内存中的div并未加入页面的DOM结构，浏览器不会渲染它及其内部元素的样式。不管是内联style属性还是<style>标签里的样式规则，都只会作用于这个离线元素本身，完全不会影响当前文档的其他元素。

3. 不会请求标记中包含的任何资源 #

⚠️ 存在风险。
部分现代浏览器（Chrome、Firefox等）在给内存元素设置innerHTML时，会自动发起图片、字体、iframe等外部资源的请求——哪怕元素从未被挂载到DOM。比如HTML中包含<img src="xxx.jpg">，浏览器会立刻尝试加载该图片，违反你这一安全要求。

改进方案 #

如果要彻底避免资源请求，可以使用DOMParser解析HTML为独立文档，再提取纯文本：

export function getTextContent(html: string) {
  const parser = new DOMParser();
  const doc = parser.parseFromString(html, 'text/html');
  return doc.body.textContent || '';
};

DOMParser创建的是独立的离线文档，不会触发任何外部资源的加载请求，同时也能安全提取纯文本。

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