我使用jquery动态表单获得了一些不错的布局生成器,jquery ui功能可以更改已使用元素的数量,它们的css属性等。一切看起来都很棒但是当前结果的呈现存在一个问题。我想保存生成的html DOM并以某种方式解析它(从DOM树中删除隐藏的元素等)。任何想法如何保存当前(修改)的html + css?
答案 0 :(得分:14)
使用jquery的解决方案如下:
将整个(修改过的)html转换为字符串表示形式:
var html = $('html').clone();
var htmlString = html.html();
Base64编码htmlString并将其放入超链接中的数据库中:
var datauri = "data:text/html;charset=utf-8;base64," + $base64.encode(htmlString);
$("body").append("<a href='" + datauri + "'>Save</a>");
注意:我在上面使用此库进行base64编码:http://hpyer.cn/codes/jquery-plugin-base64-encode-and-decode
右键单击上面动态创建的“保存”链接,然后从浏览器的上下文菜单中选择“另存为”。您修改的html文件将保存为本地文件系统上的新html文档。
我之前尝试过这个并且它有效。希望它对你和其他人也有用。 此解决方案无需任何服务器端技术,也不需要Flash,Java小程序,Active-X控件,XPCOM或任何专有的客户端技术。唯一需要的是支持数据uris的任何(现代)浏览器。
答案 1 :(得分:0)
作为第一步,您可以使用
var $alteredHtml = $('html').clone();
// use jQuery here to make alterations to the cloned html (parse it)
但要保存它,您需要一些服务器端技术,将其保存到文件或数据库。
答案 2 :(得分:0)
如果使用chrome,还有另一种方法。
tsaixingwei提供的解决方案适用于小型DOM,但是当你拥有大型文档时,它将无法正常工作。我刚刚尝试了一个包含大约30K行的文档,并且必须使用我刚刚解释过的方法。