Segue o código para evolução ou sugestões:
const form = document.getElementById("novoItem");
const listPage = document.getElementById("lista");
const itens = JSON.parse(localStorage.getItem("itens")) || [];
itens.forEach(element => {
if(element != null)
createElementHTML(element)
});
form.addEventListener("submit", (event) => {
event.preventDefault();
const nome = event.target.elements['nome'];
const quantidade = event.target.elements['quantidade'];
fillPage(nome.value.trim(), quantidade.value);
nome.value = "";
quantidade.value = "";
});
function updateElementHTML(obj){
const txt = `[data-id='${obj.id}']`;
document.querySelector(txt).innerHTML = obj.quantidade;
}
function createElementHTML(obj){
const liTag = document.createElement('li');
liTag.classList.add('item');
const strongTag = document.createElement('strong');
strongTag.innerHTML = obj.quantidade;
strongTag.dataset.id = obj.id;
liTag.appendChild(strongTag);
liTag.innerHTML += obj.nome;
liTag.appendChild(createBtnDelHTML());
listPage.appendChild(liTag);
}
function createBtnDelHTML(){
const btn = document.createElement('button');
btn.innerText = 'X';
btn.addEventListener("click", function (){
removeItem(this);
});
return btn;
}
function fillPage(nome, quantidade){
let index = containsObj(nome);
if(index > -1){
updateItem(nome, quantidade, index);
}else{
insertItem(nome, quantidade);
}
createLocalStorage();
}
function insertItem(nome, quantidade){
const obj = {'nome':nome, 'quantidade':quantidade, 'id':itens.length};
itens.push(obj);
createElementHTML(obj);
}
function updateItem(nome, quantidade, index){
const obj = {'nome':nome, 'quantidade':quantidade, 'id':index};
itens.splice(index, 1, obj);
updateElementHTML(obj);
}
function removeItem(el){
const parent = el.parentNode;
let id = parent.firstChild.getAttribute('data-id');
itens.splice(id, 1, null);
parent.remove();
createLocalStorage();
}
//Existe a função "findIndex(el => el.nome == nome)"
function containsObj(nome){
const values = itens.map(el => el.nome.toLowerCase()) || [];
return values.indexOf(nome.toLowerCase());
}
function createLocalStorage(){
localStorage.setItem('itens', JSON.stringify(itens));
}