javascript - Html 模拟工具

Question

我需要向专业设计师展示一些页面，为此我需要一个工具，展示我当前使用JQuery静态 Html 构建的页面，而不引用任何 Javascript 文件。

我正在寻找一种工具，它可以让我模拟当前页面的 html 并将所有CSS属性display、、、border等source动态设置Javascript为样式style="display: none; border: 1px solid gray;"。有人见过这样的工具吗？

Answer 1

浏览器可以做到这一点。任何由 javascript 添加的样式都将在呈现页面的 HTML 元素中的 style 属性中。

我知道 Chrome 的行为是这样的。您可以从开发人员工具箱中复制 HTML。

Answer 2

序列化 DOM 的当前状态实际上非常容易：

$('html')[0].outerHTML

但是，您必须重新添加DOCTYPE。

演示在这里。