我觉得我已经非常接近这一点了。
有一个 list ,我将其推送到数组,并设置为本地存储。我想在重新实例化浏览器时从本地存储重新打印列表
<script>
localStorage.clear();
var Array_ToDoList = [];
var toDoCount = 0;
$("#add-to-do").on("click", function(event) {
event.preventDefault();
var toDoTask = $("#to-do").val().trim();
Array_ToDoList.push(toDoTask)
localStorage.setItem("STR_Tasks", JSON.stringify(Array_ToDoList))
console.log(Array_ToDoList);
var toDoItem = $("<p>");
toDoItem.attr("id", "item-" + toDoCount);
toDoItem.append(" " + toDoTask);
var toDoClose = $("<button>");
toDoClose.attr("data-to-do", toDoCount);
toDoClose.addClass("checkbox");
toDoClose.append("✓");
toDoItem = toDoItem.prepend(toDoClose);
$("#to-dos").append(toDoItem);
$("#to-do").val("");
toDoCount++;
});
$(document.body).on("click", ".checkbox", function() {
var toDoNumber = $(this).attr("data-to-do");
$("#item-" + toDoNumber).remove();
Array_ToDoList.splice(toDoNumber, 1);
console.log(Array_ToDoList);
localStorage.setItem("STR_Tasks", JSON.stringify(Array_ToDoList))
});
var StoredToDos = Array_ToDoList.length;
for (var i = 0; i < StoredToDos; i++) {
$("#to-dos").append(localStorage.getitem(STR_Tasks[i]));
}
</script>
我知道我必须读取数组并重新打印,这可能与对我存储的内容进行去字符串化有关。
最佳答案
根据我对字面代码的理解:
- 它是“localStorage.getItem”而不是“getitem”
- localStorage 中的 key 存储是“STR_Tasks”,它只是字符串,不是可迭代类型
- 我认为你应该将对象“todoItem”推送到“Array_ToDoList”中,然后对其进行“JSON.stringify”,然后存储到 localStorage
最后,你可以这样做:
var tasks = JSON.parse(localStorage.getItem("STR_Tasks"));
for (var i = 0; i < StoredToDos; i++) {
$("#to-dos").append(tasks[i]);
}
关于javascript - 从本地存储中的数组打印列表到 DOM,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52960319/