Javascript 如何制作一个网页，显示不断更新的文件内容？

我一直在玩弄python，为一些小项目编写代码，这些小项目是我为了好玩而设计的，最近我正在做的是一个模拟房子的项目。例如，我创建了一个房子的数据结构，它有三个相互连接的房间，然后我有一个Person对象，可以根据房间的连接方式在房间中移动。这就是它现在所做的一切，到目前为止，查看模拟进度的唯一方法是通过一个我称之为“output.txt”的文件，程序将其状态打印到模拟的每个迭代中。该文件列出了房屋中的房间、它们的连接方式以及当前每个房间中的人员。这是一个示例输出：

Room: Kitchen
Connections: Living Room, Dining Room
Actors in Room: 
Bob, Sue

Room: Living Room
Connections: Kitchen
Actors in Room:
Joe

Room: Dining Room
Connections: Kitchen
Actors in Room:

我在不久前构建的服务器上编写了所有这些内容，所以最终我可以让它运行，看看会发生什么，现在我已经设置好了它，这样我就可以转到链接并查看文件的内容。我想这样做，这样我就可以刷新页面以查看更改，而不是每次我想查看更改的内容时都必须打开文件。问题是，有时我认为程序处于写入output.txt之间，所以刷新页面时什么也不显示

我想知道是否有什么方法可以让网页只显示程序的输出，甚至不需要刷新。下面是我如何在python程序中写入output.txt文件：

while(True):
    home.tick()
    output = open("/var/www/html/output.txt", "w")
    output.write(str(home))
    output.close()

基本上，home.tick（）语句会遍历房子里的所有人，并告诉他们使用tick方法，这会让他们在房子里四处游荡。然后要显示output.txt，我有一个带有

  <h1>House Simulation</h1>

  <pre id="simulationContents"></pre>

  <script>
      function populatePre(path) {
          var xhr = new XMLHttpRequest();
          xhr.onload = function() {
              document.getElementById('simulationContents').textContent = this.responseText;
          };
          xhr.open('GET', path);
          xhr.send();
      }
      populatePre('output.txt');
  </script>

房屋模拟
函数populatePre（路径）{
var xhr=new XMLHttpRequest（）；
xhr.onload=函数（）{
document.getElementById（'simulationContents'）.textContent=this.responseText；
};
xhr.open（'GET'，path）；
xhr.send（）；
}
populatePre（'output.txt'）；

正如我所说的，它有时可以工作，但有时我认为当我刷新页面时，python仍然可以在页面上工作，所以它没有显示任何内容

---

我对html和javascript都是新手，所以如果有任何帮助，我将不胜感激。这对我来说也是一个有趣的项目，因此，如果有更好的方法让输出进入html和javascript以外的网页，我肯定会接受它。提前谢谢

如果可以在同一个框中运行它们，那么可以使用从javascript本身加载数据。您还可以在读取文件之前检查file.size，这样可以避免加载空文件。