清除无序列表的所有子项，然后刷新列表

Question

所以，我只是在学习JavaScript。正在了解HTTP请求。

我使用了一个fetchPosts((函数，它为我获取帖子，并将每个帖子作为子帖子附加到我的无序列表中。我还有一个获取按钮，它为我获取所有帖子，然后我在屏幕上显示它们。每次我按下提取按钮，它都会将所有帖子作为无序列表的子项再次附加。因此，我尝试使用clearList((函数清除我的无序列表子项。

const listElement = document.querySelector('.posts');
function clearList() {
const promise = new Promise((resolve, reject) => {
while (listElement.firstChild) {
listElement.removeChild(listElement.firstChild);
}
resolve();
});
return promise;
}

然后在fetchButton上使用addEventListener获取帖子。

fetchButton.addEventListener('click', async () => {
await clearList();
fetchPosts();
});

有必要承诺这个while循环并等待它，然后获取posts((吗？因为根据我的理解，如果有数千个帖子，while循环可能需要一些时间才能清除我无序列表中的所有子项？或者有没有更有效的方法来解决这个问题？

Answer 1

是否有必要承诺while循环并等待它，然后获取posts((，因为根据我的理解，如果有数千个帖子，while循环可能需要一些时间才能清除我无序列表中的所有子项？

不，一点也不。您可以使用promise来报告异步进程的完成情况，但清除这些DOM节点并不是异步的。它是同步的。

或者有更有效的方法来解决这个问题吗？

是：删除承诺。：-(在的答案中，还有各种其他建议(所有你都应该仔细检查，多年来浏览器一直在进步(在JavaScript中清空节点的最佳方式是什么。