通过JavaScript动态添加HTML节会在刷新时复制HTML代码

我正在努力解决我的一个课程项目，我在其中一个功能上遇到了困难。 我有一个应该从Firebase DB中获取和显示所有条目的片段，但它在刷新时所做的是向DOM中再添加一个条目（Firebase中没有任何更改），而不是简单地返回Firebase结果

const数据={
“-MQufI6df_3HJ6WQtB0u”：{
“作者”：“测试”，
“isbn”：“123”，
“标题”：“测试1”
},
“-mquflmu5ggqlze0urn”：{
“作者”：“测试”，
“isbn”：“123”，
“标题”：“测试2”
},
“-mquflwiylp6t3pxhh5”：{
“作者”：“测试”，
“isbn”：“123”，
“标题”：“测试3”
}
}
document.getElementById（'loadBooks'）。addEventListener（'click'，function（）{
document.getElementById（'booksList'）。innerHTML=''；
让book=Object.entries（数据）；
for（书本中的常量书本）{
控制台。日志（簿）；
让currentBook=books[book][1]；
让newBook=document.createElement（'tr'）；
newBook.innerHTML=`
${currentBook.title}
${currentBook.author}
${currentBook.isbn}
${books[book][0]}
编辑
删除
`;
document.getElementById（'booksList'）.appendChild（newBook）；
}
});
加载所有书籍
标题
作者
Isbn
行动
形式
标题
作者
ISBN
提交
在“booksList”中添加子“newBook”之前，只需添加一个检查

var booksList = document.getElementById("booksList");
if(booksList !== null){ // thats means its exists in dom
   document.getElementById('booksList).innerHTML = ''
}

生成的标记无效。不能将
作为
的直接子项。在问题本身（->）中添加，而不仅仅是作为指向外部资源的注释。请删除与问题不直接相关的所有内容（CSS不相关，用响应的内容（
const data=…
）替换firebase部分），谢谢提示！我会确保相应地更改所有内容。完成了，但奇怪的是，它在这里工作，所以我猜是我的代码中的其他东西完成了它…工作起来很有魅力。非常感谢你！欢迎：）@PetromirKolev