使用js和php更新html的更好方法

Question

对不起，我不是一个JS程序员，但是这里有很多。

我正在尝试在PHP运行时更改一行HTML（文件名），并保持更新以表明它正在积极地做某事。这段代码完美地工作：

echo "Start<br>";
echo '<div id="counter"></div>';
echo "<script>
      const element = document.querySelector('#counter');
      </script>";
      @ob_flush();
      @flush();

for ($x=0;$x<=1000;$x++) {
    echo "<script>
          element.innerHTML = `<div>" . $x . "</div>`;
          </script>";
    @ob_flush();
    @flush();
 }

但是必须有一种更有效的方法。最终在html中带有1001个标记，看起来就像一团糟。当然，这不是最好的方法。

感谢您的帮助，请...示例。我是js菜鸟。

Answer 1

这也会产生相同的结果，并且使用html页面中唯一的script标签：

echo "Start<br>";
echo '<div id="counter"></div>';
echo "<script>
      const element = document.querySelector('#counter');
      </script>";
      @ob_flush();
      @flush();

for ($x=0;$x<=1000;$x++) {

    @ob_flush();
    @flush();
}

echo "<script>element.innerHTML = `<div>" . $x . "</div>`;</script>";