Question

我有一个id为“roster1”的HTML表，允许用户通过单击按钮添加表行，我试图通过运行以下代码段的“保存”按钮保存表状态：< / p>

function saveRoster () {
        localStorage.setItem('rosterPd1','');
        var roster = document.getElementById ('roster1');
        localStorage.setItem('rosterPd1', roster);
        }

如果我在“rosterPd1”中输入一些静态值，那么我可以毫无问题地使用写入localStorage的信息。但是，当我尝试使用上面的代码保存表时，我得到[对象HTMLTableElement]返回...这是正确的，但不是特别有用！

有人能指出我正确的方向，我需要做些什么才能让localStorage保存表格本身的内容？

Answer 1

您只能将字符串保存到存储，但似乎您正在尝试执行的操作， innerHTML 就足够了;

function saveRoster() {
    var roster = document.getElementById('roster1');
    if (!roster) return; // not found
    localStorage.setItem('rosterPd1', roster.innerHTML); // store innerHTML
}
function loadRoster() {
    var roster = document.getElementById('roster1');
    if (!roster) return; // not found
    roster.innerHTML = localStorage.getItem('rosterPd1'); // get+apply innerHTML
}

至于您获得[object HTMLTableElement]的原因，当您在 JavaScript 对toString的引用上致电<table>时会发生这种情况。

document.createElement('table').toString() // "[object HTMLTableElement]"

无法从localStorage检索动态生成的内容

1 个答案: