如何使动态或生成的HTML页面可以保存？

我对dojo，javascript和HTML编码还是有点新的。我继承了使用dojo 1.4.2编码的HTML页面（将来会升级）和javascript。本质上，HTML页面包含最初显示给用户的表单。用户填写完表单并提交后，表单会根据他们的回答替换为生成的内容。如何使动态或生成的HTML页面可以保存？

这是通过使用表单中的答案来显示或隐藏已包含在HTML文件中的各种div元素来完成的。所以表单是隐藏的，其他div元素的一些子集被显示。

我们希望这个生成的页面可以被用户保存为静态HTML页面。所以基本上我们只想将显示的div保存到文件而不是整个页面。目前，保存只保存本地副本，这需要用户在每个视图上重新提交表单。

我被告知这可以通过将数据传递给服务（可能是JSP）来完成，该服务可以处理这个并传递回浏览器。不过，我对此并不熟悉，也找不到任何例子。有没有办法做到这一点，是否有人有我可以指出的任何例子或文件？

理想情况下，我想要插入一个保存按钮，该按钮用于保存在浏览器中查看的生成内容，而不实际创建静态HTML，并保留在服务器上。

在此先感谢。

来源

2012-01-09 piperp

是仅在表单元素（输入）中的内容，还是您正在更新DIV/SPAN（其他HTML元素）？ – vol7ron 2012-01-09 19:40:20

最初在HTML顶部有一些表单元素，但是一旦你点击了提交按钮。显示的“生成”内容只不过是DIV/SPAN等，在HTML页面的底部通过更新样式显示。 – piperp 2012-01-09 20:46:56

您可以引入一种机制，根据URL参数（即解析的查询字符串的内容）更改页面。

I.e.给定包含查询部分的URL（例如http://your.site.com/path/to/page?p1=true & P2 =真）的Element小号映射到P1或P2将显示;别人不会。

来源

2012-01-09 18:39:28 FK82

鉴于我的经验和时间表，我不太可能低头走这条路，但感谢您的意见。 – piperp 2012-01-09 20:54:51

由于使用其他工具的限制，我们最终走上了这条道路。我们还将HTML页面转换为JSP以简化操作。该组合使我们能够保存静态副本。 – piperp 2012-01-29 16:02:02

好听！做得好。 – FK82 2012-02-02 22:20:18

您可以使用Flash插件下载动态创建的数据。我写了一个小技巧here。

这是脚本的an example。

只要将这三样东西放在dist之内，无论您的其他JavaScript文件在哪里。头部包括swfobject.js和bhd.js脚本。包括在身体某些HTML这样的：<div id="dl_button"></div>

在页面加载，运行脚本是这样的：

var dlBtn = new BHD.Button({ 
    // id of the element to replace with this button (required) 
    id:'dl_button', 
    // button image 
    sprite:'buttons.png' 
},function(){ 
    // set default filename 
    dlBtn.setFile('untitled.html'); 
    // set file contents 
    dlBtn.setData('<html>' + document.documentElement.innerHTML + '</html>'); 
});

你“buttons.png”需要看起来像这样（有3个状态奠定一个精灵出垂直）：

button sprite

如果一切都做得正确，点击该按钮应提示用户下载网页的当前状态的副本。

来源

2012-01-09 18:50:46

谢谢。我会在本周尝试一下，然后再制定适用于我的解决方案。 – piperp 2012-01-09 20:53:18

使用类似jQuery的，它是简单的让所有的渲染HTML内容：

$(document).ready(function(){ 
    var rendered = $('html').html(); // store this in some variable 
});

要保存网页，不能在JavaScript中那么容易做，因为浏览器的安全性问题的存在限制，阻止浏览器访问本地文件系统。

如果使用ActiveX或execCommand（http://4umi.com/web/javascript/filewrite.php），Internet Explorer可能是个例外。否则，你必须使用一些第三方工具/插件（如Flash），正如GGG指出的那样。

来源

2012-01-09 20:05:14 vol7ron

谢谢。因此，如果我理解正确，我可以获取呈现的内容，但问题仍然会允许用户根据浏览器进行本地保存，而这可能只能通过使用其他工具/插件来解决。 – piperp 2012-01-09 20:52:40

正是。为了跨浏览器，出于安全原因，您必须使用额外的插件（如Flash）。试想一下，如果您从Google列表中浏览某个网站，并且可以将[/读]写入[/从]硬盘驱动器。它可能会带上您的机密信息，或者轻易传播病毒，而您除了浏览网页之外不做其他任何事情。那将是最不安全的事情。 – vol7ron 2012-01-09 21:09:02

bookmarklet怎么样？

javascript:document.location='data:text/html,'+document.all[0].innerHTML;

它可以通过访问当前的DOM的HTML表示，然后重定向到一个新页这是一个从使用Data URI scheme HTML标记建立。

使用浏览器的常规保存菜单项可以轻松保存新页面。请注意，相对URL无法在此转换中存活，因此保存的页面可能会丢失样式表/脚本/图像引用。

来源

2012-04-25 19:15:36 lukecyca

如何使动态或生成的HTML页面可以保存？

回答

相关问题