2020/2/3 docment write遇到的问题

今天学javascript做计算器的时候发现了一个奇葩问题。
2020/2/3 docment write遇到的问题
点击以后
2020/2/3 docment write遇到的问题
2020/2/3 docment write遇到的问题
浏览器会报错,说红框内value前是一个空值。

查了一下document.write

Javascript 中只能在 HTML 输出流中使用 document.write,在文档已加载后使用它(比如在函数中),会覆盖整个文档。
我一直以为document.write 同 console.log()区别不大,一个在打印台看结果,一个在文档里看…

我们再调换一下顺序
2020/2/3 docment write遇到的问题
2020/2/3 docment write遇到的问题
2020/2/3 docment write遇到的问题
document.write会覆盖整个文档

参考:
https://blog.****.net/Jzsn_Paul/article/details/80025683
2020/2/3 docment write遇到的问题
我们可以手动关闭document.open;
2020/2/3 docment write遇到的问题
这样虽然能打印出来,但还是会报错。
2020/2/3 docment write遇到的问题
此时已经写入文档流,所以后面的值也无法获取。
完整代码:
2020/2/3 docment write遇到的问题
2020/2/3 docment write遇到的问题
如果要这个计算器正常实现,删掉document.write就好了