如何更新本地存储中数组内的id

Question

I have a bunch of li with id's that is related with the id's inside the array in localstorage, when I delete an li the element from the array is deleted as well, but if I recharge my navigator the id's of my li's is updating but in localstorage is not update, how can i update the ids into the localstorage and make match with the li id's

    const listaTweets = document.getElementById('lista-tweets');
let li;
let comment;

evenListeners();


function evenListeners() {
    document.querySelector('#formulario').addEventListener('submit', addTweet);
    listaTweets.addEventListener('click', deleteComment);
    document.addEventListener('DOMContentLoaded', localStorageDone)
}

function addTweet(e) {
    e.preventDefault();
    comment = document.getElementById('tweet').value;
    if(comment) {
        createLi(comment)
        const liId = li.id
        addCommentLocalStorage(comment, liId)
    }
}

function createLi(comment) {
    const deleteButton = document.createElement('a');
    deleteButton.classList = 'delete-comment';
    deleteButton.innerText = 'x';

    li = document.createElement('li');
    li.innerText = comment;
    li.appendChild(deleteButton);

    listaTweets.appendChild(li);

    if (li) {
        for (let i = 0; i < listaTweets.children.length; i++) {
            li.setAttribute('id', 'tweet__number' + i)
        }
    }
}

function deleteComment(e) {
    e.preventDefault();
    li = e.target.parentElement;
    if(e.target.className === 'delete-comment') {
        li.remove();
        deleteCommentLocalStorage()
    }
}

function addCommentLocalStorage(comment, liId) {
    let arrayComments;
    let idComment = liId
    arrayComments = getFromLocalStorage();

    arrayComments.length === 0 ? idComment = liId : (arrayComments[arrayComments.length - 1].idComment)

    let object = {
        id: idComment,
        com: comment
    }
    
    arrayComments.push(object)
    localStorage.setItem('comments', JSON.stringify(arrayComments))
}

function getFromLocalStorage() {
    let arrayComments;
    if(localStorage.getItem('comments') === null) {
        arrayComments = []
    } else {
        arrayComments = JSON.parse(localStorage.getItem('comments'))
    }
    
    return arrayComments
}

function localStorageDone() {
    let arrayComments;
    arrayComments = getFromLocalStorage();
    arrayComments.forEach(function(comment){
        createLi(comment.com)
    })
}

function deleteCommentLocalStorage() {
    let arrayComments = getFromLocalStorage();

    arrayComments.forEach(function(comment){
       if(comment.id === li.id) {
            let i = arrayComments.indexOf(comment);
            arrayComments.splice(i, 1);
        }
        
        localStorage.setItem('comments', JSON.stringify(arrayComments));
    })
}

Answer 1

I found a typo.

// before 
arrayComments.length === 0 ? idComment = liId : (arrayComments[arrayComments.length - 1].idComment)
// after
arrayComments.length === 0 ? idComment = liId : (arrayComments[arrayComments.length - 1].id)

However, after correcting the typo, it seems that there is a problem that the id of listaTweets and the id of arrayComments do not match each other when inserting/removing items. I think you should check this more.