如何在应用所有样式并删除javascript的情况下捕获运行时html内容/状态

问题的简短版本

是否有任何方法可以捕获动态（ajax/javascript）网页的所有应用/内联样式的运行时html（dom的当前状态）

---

较长版本

我想做的是将dom的当前状态保存为单个html页面，所有样式要么包装在

标记中，要么内联样式

类似地，我需要的是一个类似于coredump文件（提供应用程序的当前状态）的东西，但在本例中是一个（html）文件，可以加载到borwser中进行查看/调试

如果页面中没有javascript，这项任务将非常简单

• 从web浏览器执行

  文件->页面另存为->html完成

• 或者使用诸如或curl之类的工具下载页面和所有链接的图像

下面从较高的层次列出了可以通过编程实现相同功能的方法（尽管不是完整的解决方案）

• 获取html内容
• 从每个like onclick中删除所有标记和onXXX属性
• 获取*.css内容
• 将css样式嵌入到

• 将所有图像路径更改为相对路径
• 保存所有图像

但当使用javascript构建页面时，或者如果页面的状态在加载/单击时发生更改，就像某些元素被隐藏一样，并且页面的布局发生了更改，则无法使用上述方法

那么，如何保存（启用动态javascript的）网页的当前状态呢

---

如果存在这样的方法/工具/插件，那么与无法访问internet或web应用程序的用户通过电子邮件发送/共享页面将非常方便。因此，我假设您希望在桌面上执行此操作？ 然后我会使用一个更喜欢的无头浏览器，比如phantomjs，并禁用跨站点脚本。 编写javascript，将目标URL加载到iframe中，获取其dom并将其保存到文件中。

---

您仍然需要手动保存所有CSS，但不确定如何内联它。

关于如何获取DOM的当前状态

可以使用jQuery的.html（）获取当前DOM

var DOMState = $('html').html();

您可以编写一个bookmarklet来注入jquery（参见示例），然后捕获html