document write()的用法与注意事项

1 概述

document.write() 方法可向文档写入 HTML 表达式或 JavaScript 代码。
可列出多个参数(exp1,exp2,exp3,…) ,它们将按顺序被追加到文档中,默认情况是不会换行的

我们通常按照两种的方式使用 write() 方法:一是在使用该方在文档中输出 HTML,另一种是在调用该方法窗口之外的窗口。在第二种情况中,请务必使用 close() 方法来关闭文档。

2 使用方法

<html>
    <head>
    </head>
<body>
    <script type="text/javascript">
    document.write("测试文本");
    document.write("测试文本","默认不会换行");  // 多参数,默认不会换行
    document.write("<h1>测试文本</h1>")
    </script>
</body>
</html>

3 注意事项

document.write() 的使用有两点非常容易忽视和混淆的注意事项

  1. 默认不会换行
  2. 在HTML文档加载完成后,使用document.write()输出将会覆盖原有所有HTML;具体见代码
<html>
    <head>
    </head>
<body>
    <p>原本的HTML</p>
    <script type="text/javascript">
        document.write("会不会覆盖呢?")
    </script>
</body>
</html>

这样是不会覆盖的,是直接在HTML文档加载时一起完成的;

<html>
    <head>
    </head>
<body>
    <p>原本的HTML</p>
    <script type="text/javascript">
        setTimeout(() => {
     
     
            document.write("那这样会不会覆盖呢?")
        }, 1000);
    </script>
</body>
</html>

这样是会被覆盖的,因为HTML文档加载完成时,document.write()并未执行,而是之后才执行的,所以会覆盖原有的html代码

猜你喜欢

转载自blog.csdn.net/qq_41800366/article/details/101432518
今日推荐