美文网首页程序员
2018-08-21Javascript中只能在 HTML 输出

2018-08-21Javascript中只能在 HTML 输出

作者: 追风蒲公英 | 来源:发表于2018-08-21 22:52 被阅读0次

    Javascript中只能在 HTML 输出流中使用 document.write,在文档已加载后使用它(比如在函数中),会覆盖整个文档。

    html输出流:当前数据形式是HTML格式的数据,这部分数据正被导出、传输或显示,所以称为”流“。

    问题:什么是在html输出流中使用?什么是文档加载后使用?

    <!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>
    
    • 例子中代码执行到document.write就向页面写入,文档加载完成,但未调用函数,所以不会执行函数中的document.write,当点击按钮,触发了事件,则是在文档加载完成后使用的document.write,则会覆盖页面中原有信息。
    • 用javascript编写的代码只能通过html/xhtml文档才能执行,代码一行一行解析,文档在加载的过程中实际是一边加载一边用document.write写出内容到屏幕上,而加载完成后,document就关闭。如果再调用document.write往网页上写内容的话,就会重写document.
    • 比如说你调用了函数(在js中运行编写好程序后只是声明了有这个函数,但并没有调用,所以你一旦调用,就会重新加载文档),就会新建一个document对象,它会覆盖你之前的内容。
    • 这跟你函数放的位置无关,无论是在其他输出语句的前后,还是说在head或body里面写就不一样,而是调用的时机,要明确什么时候文档会重新加载。
    • 明确覆盖的原理后,主要在于是否会重新加载文档。重新加载文档的时机是什么:调用函数,或许还有其他。

    相关文章

      网友评论

        本文标题:2018-08-21Javascript中只能在 HTML 输出

        本文链接:https://www.haomeiwen.com/subject/poesiftx.html