如何在 javascript 中集成显示/隐藏？

Question

我实际上正在为我的学校做一些项目，但由于我的代码 JS 中的一些问题，我无法验证该项目。当我尝试添加/删除“项目”时，我的代码会刷新页面，因此我需要使用显示/隐藏来停止刷新。此外，当我在同一页面上使用一些过滤器时，我的代码会刷新它。如何更改

deleteWorks

和

generateWorks

的代码停止刷新？

const deleteWorks = async (id) => {
    if (!id || id < 0) return;
    
    try {
        const response = await fetch(PATH_API + PATH_WORKS + id, {
            method: 'DELETE',
            headers: {
                'Content-Type': 'application/json',
                'Authorization': `Bearer ${userLogInToken.token}`
            },
        });
        if (!response.ok) {
           throw new Error('La suppression des données n`a pas abouti!');
        }
    } catch (error) {
        console.log( error );
    }
};


const deleteWorksClick = async (event) => {
    event.preventDefault();
    const idToDelete = event.target.dataset.id;
    await deleteWorks(idToDelete);
    refreshWorks();
};


const generateWorksInModal = (allWorks) => {
    if (!allWorks) 
        return;

    
    const portfolioWorks = document.querySelector('#modal-gallery');
    portfolioWorks.innerHTML = '';

    allWorks.forEach((works) => {
        const workElement = generateWorkElementsInModal(works);

        workElement.querySelector('.trashcan').addEventListener('click', deleteWorksClick);

        portfolioWorks.appendChild(workElement);
    });
};

你可以找到我的代码

谢谢你的时间=）