在待办事项列表 JS 中添加 localStorage

Question

我试图将 localStorage 添加到我的待办事项列表中，但它只是 returns 我 'undefined' 而不是 <'li'> <'li'>输入值时创建。我已经尝试在 <'li'> 中使用 id="myList" 但它没有用

            <form>
                <input type="text" nome="task" id='task' placeholder="New..." />
                <input type="button" nome="" value='AddTask' onclick="addTask()" />
            </form>

                <ul id="myList">
                </ul>

<script type="text/javascript">
    var ul = document.getElementById("myList");

    addTask = function() {
        if (document.getElementById("task").value != ""){
            let item = document.getElementById("task");
            let itemId = Date.now().toString('16') + Math.random().toString('16').substring(2);
            ul.innerHTML += `<li id=${itemId}>${item.value}<button onclick="removeTask('${itemId}')">X</button></li>`
            
            saveLocalStorage()
        }
    }

    removeTask = function (itemId) {
        document.getElementById(itemId).remove()
        saveLocalStorage()
    }

    saveLocalStorage = function() {
        localStorage.setItem('savedList', ul.InnerHTML)
        
    }

    window.onload = function() {
        ul.innerHTML=localStorage.getItem('savedList')
    }

Answer 1

检查拼写：

localStorage.setItem('savedList', ul.InnerHTML)

应该是ul.innerHTML.

Answer 2

我不明白你到底想要什么，但尝试使用 JSON.stringify() 添加到本地存储，例如：

localStorage.setItem('savedList', JSON.stringify(ul.innerHTML));

并通过 JSON.parse() 命令获取：

const items = localStorage.getItem('savedList');
ul.innerHTML = JSON.parse(items);

还要注意拼写，喜欢 Inner 和 inner。

在待办事项列表 JS 中添加 localStorage

Add localStorage on to-do list JS

javascript

local-storage