我无法使用javascript在表中插入单元格

嗨，我正在创建这个应用程序，然后我使用javascript，这样无论我在框中输入什么，我都可以在我的详细信息历史记录中看到它。我确实插入了单元格和其他东西，但当我运行它时，我可以看到我的表数据被插入，但只有几秒钟，它就会消失，我不知道为什么我希望你能帮助我

您正在提交表单-您可以将按钮更改为type=“button”或

不要使用submit按钮单击来执行代码，而是使用submit事件和preventDefault（）

---

@导入url（“https://fonts.googleapis.com/css2?family=Poppins:wght@500&显示=交换“；
* {
保证金：0；
填充：0；
框大小：边框框；
字体系列：“罂粟花”；
}
.集装箱{
宽度：100%；
高度：100vh；
显示器：flex；
证明内容：中心；
对齐项目：居中；
背景：rgba（255，255，255，0.685）；
}
.表格容器{
最小宽度：500px；
最小高度：600px；
背景：线性梯度（55度，rgb（71126247），rgba（53,52,52,0.295））；
填充：20px 30px；
边框：5px实心rgb（37,37,49）；
边界半径：10px；
文本对齐：居中；
颜色：rgb（58,57,57）；
盒影：2px20px#333；
位置：相对位置；
}
.表格容器h1{
边缘底部：2rem；
}
.表格容器h3{
边缘底部：2rem；
位置：相对位置；
}
.form容器h3:：之前{
内容：“；
宽度：4rem；
高度：2倍；
背景色：rgb（41,32,32）；
位置：绝对位置；
最高：50%；
左：20%；
}
.form容器h3:：之后{
内容：“；
宽度：4rem；
高度：2倍；
背景色：rgb（41,32,32）；
位置：绝对位置；
最高：50%；
右：20%；
}
形式{
显示器：flex；
弯曲方向：立柱；
证明内容：周围的空间；
对齐项目：居中；
}
表单输入{
宽度：100%；
身高：100%；
填充：10px；
背景：无；
大纲：无；
边界：无；
边框底部：2个实心rgb（41,32,32）；
}
.细节{
边缘顶部：20px；
}
.金额{
边缘顶部：50px；
}
#btn{
文字装饰：无；
颜色：#000；
边框：1px实心；
边界半径：20px；
背景：#fff；
填充：10px 20px；
位置：绝对位置；
底部：28%；
光标：指针；
过渡：500ms缓解；
}
#btn：悬停{
背景：#000；
颜色：#fff；
}
.历史{
边缘顶部：80px；
显示器：flex；
证明内容：周围的空间；
对齐项目：居中；
}
.col-2{
边框：1px实心；
填充物：5px10px；
背景：#fff；
}
.标签-1{
颜色：绿色；
}
.标签-2{
颜色：红色；
}
.标签-3{
颜色：rgb（2416223）；
}
.详细信息容器{
左边距：10px；
宽度：500px；
高度：600px；
边框：5px实心#333；
边界半径：10px；
文本对齐：居中；
背景：线性梯度（55度，rgb（71126247），rgba（53,52,52,0.295））；
}
.容器h1的详细信息{
边缘顶部：20px；
}
#我的桌子{
边界塌陷：塌陷；
背景：#fff；
边框：1px实心；
宽度：100%；
}
#我的桌子，
运输署，
th{
边框：2倍实心；
填充：10px 20px；
}
运输署{
颜色：#000；
}

费用追踪器应用程序
新条目
细节
数量
进入
流入量

$0.00
流出

$0.00
天平

$0.00
详细历史
细节
数量

let enter=document.getElementById（“btn”）；
输入.addEventListener（“单击”，显示功能）；
设row=1；
函数displayFunction（）{
let detail=document.getElementById（“细节输入”）.value；
让金额=document.getElementById（“金额输入”）.value；
如果（！详细信息| |！金额）{
提醒（“请填写方框”）；
返回；
}
let table=document.getElementById（“myTable”）；
console.log（表）
设newRow=table.insertRow（row）；
设cell1=newRow.insertCell（0）；
console.log（newRow）；
设cell2=newRow.insertCell（1）；
cell1.innerHTML=详细信息；
cell2.innerHTML=金额；
行++；
返回；
}

@导入url（“https://fonts.googleapis.com/css2?family=Poppins:wght@500&显示=交换“；
* {
保证金：0；
填充：0；
框大小：边框框；
字体系列：“罂粟花”；
}
.集装箱{
宽度：100%；
高度：100vh；
显示器：flex；
证明内容：中心；
对齐项目：居中；
背景：rgba（255，255，255，0.685）；
}
.表格容器{
最小宽度：500px；
最小高度：600px；
背景：线性梯度(
55度，
rgb（71126247），
rgba（53,52,52,0.295）
);
填充：20px 30px；
边框：5px实心rgb（37,37,49）；
边界半径：10px；
文本对齐：居中；
颜色：rgb（58,57,57）；
盒影：2px20px#333；
位置：相对位置；
}
.表格容器h1{
边缘底部：2rem；
}
.表格容器h3{
边缘底部：2rem；
位置：相对位置；
}
.form容器h3:：之前{
内容：“；
宽度：4rem；
高度：2倍；
背景色：rgb（41,32,32）；
位置：绝对位置；
最高：50%；
左：20%；
}
.form容器h3:：之后{
内容：“；
宽度：4rem；
高度：2倍；
背景色：rgb（41,32,32）；
位置：绝对位置；
最高：50%；
右：20%；
}
形式{
显示器：flex；
弯曲方向：立柱；
证明内容：周围的空间；
对齐项目：居中；
}
表单输入{
宽度：100%；
身高：100%；
填充：10px；
背景：无；
大纲：无；
边界：无；
边框底部：2个实心rgb（41,32,32）；
}
.细节{
边缘顶部：20px；
}
.金额{
边缘顶部：50px；
}
#btn{
文字装饰：无；
颜色：#000；
边框：1px实心；
边界半径：20px；
背景：#fff；
填充：10px 20px；
位置：绝对位置；
底部：28%；
光标：指针；
过渡：500ms缓解；
}
#btn：悬停{
背景：#000；
颜色：#fff；
}
.历史{
边缘顶部：80px；
显示器：flex；
证明内容：周围的空间；
对齐它
let enter = document.getElementById("form").addEventListener("submit", displayFunction);

function displayFunction(e) {
  e.preventDefault(); <<<