Здравствуйте дамы и господа.
Пытаюсь создать что-то вроде To-Do List, функционал весь есть, который задумал: добавить задачу, удалить какую-то задачу и очистить весь список.
Не хватает одного, сохранения при обновлении страницы. то бишь localStorage. Не могу понять, как это сделать, пробовал непосредственно закинуть input.value - записывает одно значение, а при добавление других символов из input`a просто их дописывает к уже имеющемуся в loacaStorage. Пробовал через пустой массив - тоже ничего не получилось. Код ниже приведу, а так же закину в песочницу, там будет полный код.
Помогите решить задачу с localStorage.
Вот ссыль на песочницу, там весь код:
https://jsfiddle.net/baddesinger5/c9atxpoq/2/
Адаптива нет если что, не пугайтесь и разверните побольше окно с отображением.
//create task
const addBtn = document.querySelector('.add');
let input = document.querySelector("#input[type='text']");
let getUl = document.querySelector('.list');
let liMaker = addBtn.addEventListener('click', function() {
let createLi = document.createElement('li');
createLi.classList.add('row');
let createSpan = document.createElement('span');
let createLink = document.createElement('a');
createLink.innerHTML = '✖';
getUl.appendChild(createLi);
createLi.append(input.value);
createLi.append(createSpan);
createSpan.append(createLink);
// //delete one task
function removeItem() {
let eachItem = this;
createLink.addEventListener('click', function(e) {
e.preventDefault();
createLi.remove(eachItem);
createLink.remove(eachItem);
})
} removeItem();
// delete all
const removeAll = document.querySelector('.remove-all');
removeAll.addEventListener('click', function() {
createLi.remove();
createSpan.remove();
localStorage.clear();
})
})
Заранее спасибо кто откликнется.
Простой
