00—page coverage problem in js document

I encountered a problem today when I started learning js at w3School: you can only use document.write in HTML output. If you use this method after the document has loaded, it will overwrite the entire document. , the w3School source code is as follows:

  <!DOCTYPE html>
<html>
<body>

<p>
JavaScript 能够直接写入 HTML 输出流中：
</p>

<script>
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph.</p>");
</script>

<p>
您只能在 HTML 输出流中使用 <strong>document.write</strong>。
如果您在文档已加载后使用它（比如在函数中），会覆盖整个文档。
</p>

</body>
</html>

After reviewing the information, write your understanding below:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
  </head>
<body>

 <p>
   JavaScript 能够直接写入 HTML 输出流中：
 </p>
 <script>
  document.write("<h1>This is a heading</h1>");
  document.write("<p>This is a paragraph.</p>");
 </script>

 <p>
  您只能在 HTML 输出流中使用 <strong>document.write</strong>。
  如果您在文档已加载后使用它（比如在函数中），会覆盖整个文档。
 </p>

 <button onclick="myFunction()">点击这里</button>

  <script>
  function myFunction()
  {
  document.write("调用了函数，文档被重写");
  }
  </script>

</body>
 </html>

In this example, the program will not execute down until the second document.write is executed. After clicking the button, the third document.write will be executed. At this time, the entire page will be refreshed, and only the function is called, and the document is Rewriting , that is, executing document.write will cause the original information in the entire page to be overwritten. Specific details and principles can be found at https://blog.csdn.net/wxh24578/article/details/72820367 .
Here is a summary of a passage from https://blog.csdn.net/qq_37425546/article/details/54868908 :

The code written in javascript can only be executed through the html/xhtml document. The code is parsed line by line. During the loading process, the document is actually loaded and the content is written to the screen with document.write. After the loading is completed, the document is closed. . If you call document.write again to write content on the web page, the document will be rewritten.

00—page coverage problem in js document

Guess you like