如何显示经DOMParser生成的动态HTML文档（类window.location跳转）

你已经成功用DOMParser生成了完整的HTML文档对象，要让它替代当前页面（达到类似window.location跳转的效果），有几种实用的方法，根据你的需求选就行：

方法1：直接替换页面根元素 #

这是最直接的方式，把当前页面的<html>元素完全替换成新生成的文档根元素：

// 用新文档的html元素替换当前页面的html元素
document.documentElement.replaceWith(new_html.documentElement);

这种方式会瞬间更新页面的所有内容、样式和iframe，和跳转后的视觉效果一致，而且不需要重新加载整个页面框架。

方法2：用document.write写入完整HTML字符串 #

如果你还保留着最初的html_to_parse字符串，也可以用传统的文档写入方式，这种方式会清空当前页面并加载新内容，和页面跳转的行为更接近：

// 打开文档、写入HTML、关闭文档，完成页面替换
document.open();
document.write(html_to_parse);
document.close();

⚠️ 注意：这种方式会自动执行新HTML里的脚本标签，而用DOMParser解析后再替换的方式，脚本不会自动执行（如果你的新页面有脚本，这个方法更省心）。

方法3：结合历史记录实现可后退的页面替换 #

如果你希望用户点击浏览器后退按钮能回到原来的页面，可以配合history API：

// 替换当前历史记录（用pushState则添加新记录，允许后退）
history.replaceState({}, "my title", window.location.href);
// 然后替换页面内容
document.documentElement.replaceWith(new_html.documentElement);

用history.pushState的话，会在历史栈里新增一条记录，用户后退会回到替换前的页面；用replaceState则是覆盖当前记录，后退会回到上一个页面（和直接跳转的历史行为一致）。

根据你的场景，方法1或方法2应该就能满足需求啦，看你更倾向于直接操作DOM还是用字符串写入的方式。

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