Javascript 为什么窗体值会从控制台日志中消失？

在下面的代码中，我试图

console.log

单击按钮时的表单输入值。但是，单击按钮后，该值仅会在消失之前短暂记录。 为什么会发生这种情况以及如何解决

document.querySelector（“按钮”）.addEventListener（“单击”，函数）（）{
const listItem=document.querySelector（“输入”）.value；
console.log（列表项）；
});

添加
提交表单时，浏览器会向服务器发送请求并刷新页面。要禁用此行为，单击按钮时可以使用
event.preventDefault（）


document.querySelector（“按钮”）.addEventListener（“单击”），函数（事件）{
event.preventDefault（）；
const listItem=document.querySelector（“输入”）.value；
console.log（列表项）；
});

添加
其他人解释说，提交表单会重新加载页面。但这并没有真正解决有关控制台日志的问题

转到开发人员工具设置，并在控制台部分选中“导航时保留日志”。这样，当页面因表单提交而重新加载时，您就不会丢失日志消息。
这是否回答了您的问题？您在单击后提交表单。因此，它消失了。将按钮类型从submit更改为button