如何將javascript html dom文檔存儲到locastorage

Question

我有要存儲在html5本地存儲中的文檔（組件樹）“ m”。 我嘗試將其設置為本地存儲。 但是當我取回它時，此m已更改為[object Document]。 如何將文檔存儲到本地存儲並將其作為文檔本身檢索？

以下是我嘗試過的代碼

應用程序將ajax請求發送到服務器以撤消日歷事件，並在請求成功時接收到xhtml的dom表示。 當用戶轉到下周查看時，該應用必須從本地存儲中撤消該事件。 為了將響應從js文件發送到客戶端，dom表示也是必要的。因此我們需要將dom表示存儲到本地存儲中。

我的要求是在第一張圖片的控制台中，您可以看到'k'是從文檔m中檢索出來的，並作為響應發送到客戶端。因此，我想要的是將該k或m存儲到本地存儲中，以便我可以對其進行操作在同一個js文件中。此代碼在xhtml文件中使用的單獨的js文件中。

我正在使用primefaces 4.0，jsf 2.1。

當我使用

localStorage.setItem（ “calendarevents”，JSON.stringify（K））;

我收到一個錯誤“將圓形結構轉換為json”。

Answer 1

您需要通過執行以下操作來存儲文檔html的字符串表示形式：

localStorage.setItem('calendar', document.documentElement.innerHTML);

執行此操作時：

localStorage.setItem('calendar', document.documentElement);

...它將document.documentElement.toString()的結果存儲在localStorage中，這對於您的目的不起作用。

Answer 2

localStorage將每個值轉換為字符串。 要存儲對象，您必須使用解決方法。

我想您可以使用此答案中描述的方法

var testObject = { 'one': 1, 'two': 2, 'three': 3 };

// Put the object into storage
localStorage.setItem('testObject', JSON.stringify(testObject));

// Retrieve the object from storage
var retrievedObject = localStorage.getItem('testObject');

console.log('retrievedObject: ', JSON.parse(retrievedObject));