我需要克隆一些 HTML 內容，將其存盤在 sessionStorage 中，然后將存盤的 HTML 重新部署回另一個頁面上的 DOM。就我的測驗而言，我只是在一個頁面上完成所有操作，并通過頁面重繪 來呼叫 sessionStorage。
所以，這就是我到目前為止所想出的。
var exp561CardFour = document.getElementById('dashboard_item_four');
var clnCardFour = exp561CardFour.cloneNode(true);
sessionStorage.setItem('storedCardFour', clnCardFour);
當我在控制臺中使用這段代碼抓取 HTML 時...
var grabCardFour = sessionStorage.getItem('storedCardFour');
......我最終得到了這個：
請幫忙 ：）
編輯：僅供參考 clnCardFour 只包含一些 HTML，它作業正常
在控制臺中使用 Parking Masters 建議進行編輯：
uj5u.com熱心網友回復：
這HTMLIElement是一個<i>元素，您將整個元素物件存盤在存盤中。
您可以使用JSON(JavaScript Object Notation).stringify({})將元素字串化，然后再次決議它以獲取元素。
這是一個例子：
var myEl = document.getElementById("my-el");
alert("This will not print the object: " myEl);
alert("This will print the object: " JSON.stringify(myEl));<i id="my-el"></i>由于物件太長，溢位的物件不會被字串化。
使用 jQuery：
var myEl = $("my-el");
alert("This will not print the jQuery object: " myEl);
alert("This will print the jQuery object: " JSON.stringify(myEl));<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<i id="my-el"></i>更多關于JSON.stringify和JSON.parse在 MDN。
（請注意您存盤的內容sessionStorage，一次最多只能存盤 2kB）。
現在使用JSON.parse以下方法獲取決議的物件：
var myObj = "{}";
myObj; // "{}"
JSON.parse(myObj); // Object { ... }
我整理了一個活生生的例子：
var exp561CardFour = document.getElementById('dashboard_item_four');
var clnCardFour = exp561CardFour.cloneNode(true);
sessionStorage.setItem('storedCardFour', JSON.stringify(clnCardFour));
// When in an <iframe>, it'll say The operation is insecure."
var grabCardFour = JSON.parse(sessionStorage.getItem('storedCardFour'));<i id="dashboard_item_four"><i>stacksnippets.net由于 iframe 安全問題，代碼片段來自并且將無法作業。
但是，請在您的本地服務器/檔案上嘗試一下，祝您好運。
uj5u.com熱心網友回復：
Storage API (sessionStorage/localStorage) 只存盤字串。你打電話時：
sessionStorage.setItem('storedCardFour', clnCardFour);
API 使用.toString()針對物件的方法clnCardFour- 回傳[object HTMLLIElement].
所以你需要那個節點的字串表示。您可以通過像這樣獲取節點的 OuterHTML 來實作這一點：
sessionStorage.setItem('storedCardFour', clnCardFour.outerHTML);
當您需要恢復該節點時，只需使用父節點的.innerHTML屬性將其放回 DOM。
let div = document.querySelector('div');
let exp561CardFour = document.getElementById('dashboard_item_four');
sessionStorage.setItem('storedCardFour', exp561CardFour.outerHTML);
let clonedFromStorage = sessionStorage.getItem('storedCardFour');
div.innerHTML = clonedFromStorage
<div>
<i id="dashboard_item_four">Hello there!</i>
</div>
這是一個JS Bin 示例
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/360168.html
標籤：javascript 克隆 会话存储
上一篇：嘗試決議JSON