使用document.write向文档输出写内容;

document.write用法:document.write("要输出的内容");

其实document.write()有两种情况:

　　1.在文档流加载过程中执行代码:document.write会在代码所在位置添加输出内容.如下

　　　　

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script type="text/javascript">

        document.write("<h1>放在header里的document.write</h1>")

    </script>

</head>

<body>

<script type="text/javascript">

    document.write("<h1>放在body里的document.write</h1>")

</script>

</body>

</html>

　　执行结果:

　　如果写入位置在header里,而且为引入文档,引入文件会被放在head里,但是如果先写非引入文档的内容,引入文档的标签也会写在body里,(这部分没有仔细研究,写项目的时候还没遇到坑... document.write应该会在文档中打开一个开口,然后写入要输入的东西,但是如果不存在html结构文档(只存在引入文档的标签像link,script引入,和meta这些),就会写到head中)

　　2.在文档流加载完成时执行代码:document.write会重新开启一个文档流覆盖之前网页上存在的文档,页面显示效果就是原先的网页上的内容都消失了,只剩下写入的内容.如下:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script type="text/javascript">

        document.write("<h1>放在header里的document.write</h1>")

    </script>

</head>

<body>

<script type="text/javascript">

    document.write("<h1>放在body里的document.write</h1>")

    setTimeout(function () {

        document.write("糟糕文档不见了!")

    },2000)

</script>

</body>

</html>

　　

在两秒之后执行结果:

因为在执行document.write()的时候文档已经加载完成,会重新打开一个文档流覆盖之前的文档流.所以原先的文档会消失.

你不知道的document.write的更多相关文章

  1. 另5个你不知道的HTML5接口API

    原文地址: 5 More HTML5 APIs You Didn’t Know Existed 演示地址: 全屏API Demo 原文日期: 2012年11月08日 翻译日期: 2013年08月13日 ...

  2. 你不知道的getComputedStyle

    你不知道的getComputedStyle jQuery的css()的底层实现就用到了getComputedStyle这个方法,也许我们用到的很少,但是不得不说这时一个非常强大的函数,下面让我们一探究 ...

  3. setTimeout,setInterval你不知道的…

    javascript线程解释(setTimeout,setInterval你不知道的事) 标签: javascript引擎任务浏览器functionxmlhttprequest 2011-11-21 ...

  4. setTimeout,setInterval你不知道的事

    javascript线程解释(setTimeout,setInterval你不知道的事) 标签: javascript引擎任务浏览器functionxmlhttprequest 2011-11-21 ...

  5. 翻译连载 | 第 11 章：融会贯通 －《JavaScript轻量级函数式编程》 |《你不知道的JS》姊妹篇

    原文地址:Functional-Light-JS 原文作者:Kyle Simpson-<You-Dont-Know-JS>作者 关于译者:这是一个流淌着沪江血液的纯粹工程:认真,是 HTM ...

  6. JavaScript中的this（你不知道的JavaScript）

    JavaScript中的this,刚接触JavaScript时大家都在大肆渲染说其多么多么的灵巧重要,然而自己并不关心:随着自己对JavaScript一步步深入了解,突然恍然大悟,原来它真的很重要!所 ...

  7. 读《你不知道的JavaScript(上卷)》后感-浅谈JavaScript作用域（一）

    原文 一. 序言 最近我在读一本书:<你不知道的JavaScript>,这书分为上中卷,内容非常丰富,认真细读,能学到非常多JavaScript的知识点,希望广大的前端同胞们,也入手看看这 ...

  8. 5个你不知道的HTML5的接口

    原文地址:5 HTML5 APIs You Didn't Know Existed 原文日期: 2010年09月27日 翻译日期: 2013年8月7日 当人们看到或者说出"HTML5&quo ...

  9. 你不知道的JavaScript--Item23 定时器的合理使用

    1.定时器概述 window对象提供了两个方法来实现定时器的效果,分别是window.setTimeout()和window.setInterval.其中前者可以使一段代码在指定时间后运行:而后者则可 ...

随机推荐

  1. [Unity Shader]光照模型对物体的假设

    什么是光照模型 光照模型就是模拟光在物体间的传递过程,以确保物体可见表面每一点的亮度和颜色. 当光照射到一个物体表面时,光可能被吸收.反射或折射.反射和折射的光使物体可见.如果入射光全部被吸收,物体将 ...

  2. log4cxx第三篇----使用多个logger

    使用多个logger时,所有logger的配置写在一个配置文件里面 两个例子: 1 一个继承的例子(http://logging.apache.org/log4cxx/) // file com/fo ...

  3. ID3决策树预测的java实现

    刚才写了ID3决策树的建立,这个是通过决策树来进行预测.这里主要用到的就是XML的遍历解析,比较简单. 关于xml的解析,参考了: http://blog.csdn.net/soszou/articl ...

  4. memcache细节解析

    转自:原链接 Memcached内存管理采取预分配.分组管理的方式,分组管理就是划分slab class,按照chunk的大小slab被分为很多种类.   slab Slab是一个内存块,它是memc ...

  5. POJ 2609 Ferry Loading

    双塔DP+输出路径. 由于内存限制,DP只能开滚动数组来记录. 我的写法比较渣,但是POJ能AC,但是ZOJ依旧MLE,更加奇怪的是Uva上无论怎么改都是WA,其他人POJ过的交到Uva也是WA. # ...

  6. ios UIKit动力 分类： ios技术 2015-07-14 12:55 196人阅读 评论(0) 收藏

    UIkit动力学是UIkit框架中模拟真实世界的一些特性. UIDynamicAnimator 主要有UIDynamicAnimator类,通过这个类中的不同行为来实现一些动态特性. 它一般有两种初始 ...

  7. MongoDB升级教程

    1.排序 sort()方法:其中 1 为升序排列,而-1是用于降序排列. db.col.find({},{"title":1,_id:0}).sort({"likes&q ...

  8. 【滚动数组】【状压dp】Gym - 100956F - Colored Path

    f(i,j,S)表示到(i,j),且经由的路径上的颜色集合为S的价值的最小值,从上方和左方转移过来即可. 要注意,内存不足,需要滚动数组优化,即使用了map,还是需要. 路径输出的时候,可以再跑一遍d ...

  9. 在ubuntu中为navicat创建快捷方式

    在ubuntu中,解压navicat并不会生成快捷方式,每次运行都需要进入软件解压的目录,然后运行命令开启navicat,十分不便．今天尝试引入快捷方式,直接双击运行,感觉挺不错． 首先下载一个合适的 ...

  10. OpenSceneGraph几个重要功能节点练习

    OpenSceneGraph几个重要功能节点练习 一. 空间变换节点 空间变换中最重要的是坐标系和矩阵运算了.OSG坐标系中使用右手系,Z轴垂直向上,X轴水平向右,Y轴垂直屏幕向里,与OpenGL和D ...