Question

我正在编写一个待办事项跟踪器应用程序，并且尝试使用Cookie来创建半持久性。但是，刷新页面后，已删除的列表项会再次出现并且无法使用，即无法正常删除，也不能删除（更改CSS）。

<span style="color: yellow;"></span>标签中包含<body>，该标签调用onload = "loadStorage"且ID =“ list”

<ul>

列表项的创建方式如下：

/* load on page load */
function loadStorage() {
    document.getElementById("list").innerHTML = document.cookie;
}

，然后传递给

function newElement() {
    event.preventDefault(); // stop default redirect

    var li = document.createElement("li"); // create an <li> element

    /* make a text node from the input and put it in the <li> */
    var inputValue = document.getElementById("task").value; // retrieve value of text box
    var t = document.createTextNode(inputValue); // create a text node of the box value
    li.appendChild(t); // put the text node in the single <li>

    /* attach a button to the <li> element that deletes it */
    var btn = document.createElement("BUTTON"); // Create a <button> element
    btn.innerHTML = "X"; // Insert text
    btn.className = "button" // add class name for CSS targeting
    btn.addEventListener('click', removeItem); // add event listener for item deletion

    li.appendChild(btn); // Append <button> to <li> 

    li.addEventListener('click', checkToggle); // add event listener for a click to toggle a strikethrough

    appendItem("list", li); //append the li item to the ul
}

这似乎可行，因为刷新页面后，项目会保留下来。通常，附加到function appendItem(id, li) { event.preventDefault(); // prevent the defualt redirect document.getElementById(id).appendChild(li); // append the single li element to the ul document.cookie = document.getElementById(id).innerHTML; // Store }元素中的按钮的removeItem()函数会删除该项目，但是在添加以下内容后，刷新页面后它将不再起作用。还应该重置存储在cookie中的列表，但这似乎不起作用。

<li>

尽管已更改，但JavaScript cookie仍然存在

0 个答案: