Как можно сделать сохранение в "приложении заметок" через localStorage для каждой создаваемой заметки? (JS)
Как можно сделать сохранение в "приложении заметок" через localStorage для каждой создаваемой заметки? (JS)
const btn = document.querySelector('.buton');
const container = document.querySelector('.container');
btn.addEventListener('click', Write);
let inp = document.querySelector('.inp');
let Spisok = document.getElementById('spisok');
function SaveData()
{
localStorage.setItem('todoEl', Spisok.innerHTML);
}
function Write()
{
let task = document.createElement('li');
let zapiska = document.createElement('span');
let delBtn= document.createElement('button');
if(inp.value !== "")
{
task.appendChild(document.createElement('p'))
task.appendChild(zapiska);
task.appendChild(delBtn);
Spisok.appendChild(task);
inp.placeholder = "";
}
else
{
inp.placeholder = "Введите что-нибудь";
}
task.classList.add('spisokEl');
zapiska.innerText = inp.value;
zapiska.classList.add('centering');
console.log(zapiska);
delBtn.innerText = "✖";
delBtn.classList.add('centeringBtn');
delBtn.addEventListener('click', function deleteSelf()
{
this.parentElement.remove();
localStorage.removeItem('todoEl');
})
SaveData()
}
if(localStorage.getItem('todoEl'))
{
Spisok.innerHTML = localStorage.getItem('todoEl');
}
<html>
<head>
<link rel="stylesheet" href="List.css">
</head>
<body>
<div align="center">
<input class="inp"></input>
<input type="button" class="buton" value="Записать"></input>
<p>
<ul id="spisok">
</ul>
</div>
<script src="List.js"></script>
</body>
</html>