Question

所以这是两个问题？

我要做的是：

用户可以修改上的元素页面，修改后他可以保存变化，下次当他打开页面，就像他保存的那样它

它与http://www.google.com/ig有点相似，可以在放置小部件时保存您的更改。而且我发现每次放置小部件时它都会发送http://www.google.com/ig/setp?et=4b20aa66V7sx6KZ1&mp=2_1%3A1_2%3A11_2%3A10_2%3A9_2%3A3_2%3A4_2%3A5_2%3A6_2%3A_opt_3%3A7_3之类的请求，但我无法解读它的含义。

11_1：1_1：2_1：10_2：9_2：3_2：4_2：5_2：6_2：_opt_3：7_3是urldecode之后该网址所包含的内容，是否可以猜出其含义？

Answer 1

如果要将网页保存为对象或字符串，然后稍后重新加载，请查看innerHTML。

修改

如果要保存多个项目的状态，那么您应该手动执行此操作。保存整个DOM将节省太多无用的信息。因此，如果您需要保存元素列表的位置（x，y）和大小（宽度，高度），那么您需要遍历所有这些项并获取属性，将它们存储在对象中，然后存储数据库中的对象（可能是JSON）。下次用户登录时，您将从数据库中检索状态，将其转换为对象，循环遍历它，然后为每个元素设置所有这些属性。像innerHTML这样的东西不会保存DOM的属性，只保存属性。

Answer 2

您不应该保存页面的DOM。如果您发布另一个版本，具有改进的样式，不同的类名和新标签，该怎么办？用户总是会在上次保存时看到旧页面。

相反，您应该存储某种高级布局数据，例如小部件的坐标。

Answer 3

保存DOM可能不是您想要做的。（请参阅提示的其他答案。）但是，如果你真的坚持这个，那么你可能会这样做：

var myid = 'some-div-i-want-to-save';
var element = document.getElementById(myid);
// serialize as string
var elementstring = element.innerHTML;
// make a copy of the DOM tree for reuse in Javascript
var elementdom = element.cloneNode(true);

如何通过快照捕捉DOM和重建？

3 个答案:

修改