DOCUMENT类型

JS通过document类型表示文档，在文档中document对象是HTMLDocument的一个实例，表示整个HTML页面。document对象是window对象的一个属性，因此可以将其作为全局对象来访问。

document节点的特征：

在这里，可以使用documentElement和document.body来分别取得对html元素和body元素的引用。

在这里对于html的引用是有条件的。如果文档前面有<!DOCTYPE html>的话，或者body里有内容的话，就无法引用。

document还有一个body属性，直指body元素，对于body的引用方式，使用的频率非常高

除此之外，document还提供了一些特殊的集合。这些集合都是HTMLCollection对象，为访问文档提供了快捷方式：

DOM文档写入

有一个document对象的功能已经存在很多年了，那就是将输出流写入到网页中的能力，有四个方法可以调用：

document.write() 接受一个字符串参数，即要写入输出流中的文本，write会原样写入。不过根据经验，write() 可接受任何多个参数

documen.writeln()接受一个字符串参数，但是会在末尾添加换行符(\n)

输出：

在页面加载过程中，可以使用这两个办法动态地加入内容。document.write可以多次输入：

在这里，document.forms 集合可返回对文档中所有 Form 对象的引用。

输出：

输出结果：

window.onload事件是在文档内容完全加载完毕再去执行事件处理函数，当然文档流已经关闭了，这个时候执行doucment.write函数会自动调用document.open()函数创建一个新的文档流，并写入新的内容，再通过浏览器展现，这样就会覆盖原来的内容。

再来看一个例子：

输出：

在以上代码中，原来的文档内容并没有被清空，这是因为当前文档流是由浏览器所创建，并且document.wirte()函数身处其中，也就是执行此函数的时候文档流并没有被关闭，这个时候不会调用document.open()函数创建新文档流，所以也就不会被覆盖了。

再来看一个例子：

上面使用document.close()关闭文档流了，为什么还是不能够覆盖原来的内容的，很遗憾，文档流是由浏览器创建，无权限手动关闭，document.close()函数只能够关闭由document.open()函数创建的文档流。

最后看一个例子：

由doucment.open()创建的文档流就可以由document.close()关闭，那么第二个document.write()输出的内容会覆盖掉第一个输出的内容

window.open()创建的是一个window窗口，并不是文档流，接下来的文档流是由newWindow.document.write("蚂蚁部落欢迎您")创建，调用此方法就会自动调用document.open()创建一个文档流。

第十章—DOM(一)——Document类型的更多相关文章

  1. 第十章—DOM(0)—NODE类型

    DOM1定义了一个node接口,该接口由DOM的所有节点类型实现. 所有的节点都存在这样或那样的关系.在HTML中,head,body可以看出是html的子元素,html是head,body的父元素, ...

  2. js DOM Document类型

    JavaScript通过Document类型访问文档.在浏览器中,document对象是HTMLDocument(继承自 Document类型)的一个实例,表示整个HTML页面.document对象是 ...

  3. 从原型链看DOM－－Document类型

    JavaScript通过Document类型表示文档,原型链的继承关系为:document.__proto__->HTMLDocument.prototype->Document.prot ...

  4. 第10章 文档对象模型DOM 10.2 Document类型

    Document 类型 JavaScript 通过 Document 类型表示文档.在浏览器中, document 对象是 HTMLDocument (继承自 Document 类型)的一个实例,表示 ...

  5. Commons JXPath - DOM/JDOM Document Access

    除了 JavaBean,JXPath 也可以访问 DOM/JDOM. 示例 XML: <?xml version="1.0" encoding="utf-8&quo ...

  6. Document类型知识大全

    Document类型 1.文档的子节点  Document类型可以表示HTML页面或者其他基于XML的文档.不过,最常见的应用还是作为HTMLDocument实例的document对象.通过这个文档对 ...

  7. 10.1.2 Document类型【JavaScript高级程序设计第三版】

    JavaScript 通过Document 类型表示文档.在浏览器中,document 对象是HTMLDocument(继承自Document 类型)的一个实例,表示整个HTML 页面.而且,docu ...

  8. JavaScript高级程序设计学习笔记第十章--DOM

    1.DOM:文档对象模型,是针对 HTML 和 XML 文档的一个 API(应用程序编程接口). 2.DOM 可以将任何 HTML 或 XML 文档描绘成一个由多层节点构成的结构. 3.文档节点是每个 ...

  9. JAVASCRIPT高程笔记-------第十章 DOM对象

    10.1.1 node类型 --除IE外 所有浏览器都可以访问到这个类型 :JS中所有的节点类型都继承自Node类型 nodeName 与nodeValue  如果是一个元素 那么nodeName中保 ...

随机推荐

  1. vue中使用watch函数，当数据改变时自动引发事件

    本来我的需求是这样的,使用ElementUI的日期选择器,当日期选择器被更改时需要根据新日期来向服务器获取新数据,但是发现这个日期选择器没有change事件,后来终于发现vue有个watch函数就是用 ...

  2. [自学]数据库ER图基础概念整理（转）

    ER图分为实体.属性.关系三个核心部分.实体是长方形体现,而属性则是椭圆形,关系为菱形. ER图的实体(entity)即数据模型中的数据对象,例如人.学生.音乐都可以作为一个数据对象,用长方体来表示, ...

  3. Aspose破解版本dll

    下面是Aspose破解版本dll,并不是最新版本,有需要的可以下载使用: 下载Aspose各种破解版dll

  4. springboot整合rabbitMQ时遇到的消息无法入列问题

    问题描述: 对列和交换器配置如下(绑定的正常交换器的key是“convert”): 管理平台上手动发是可以的: 而通过程序发消息不行,根本没有进入队列: 解决:显式指定交换器(备选交换器和死信交换器都 ...

  5. windows API 第 18篇 FindFirstVolume FindNextVolume

    函数定义:Retrieves the name of a volume on a computer. FindFirstVolume is used to begin scanning the vol ...

  6. [转]C#设计模式（4）－Simple Factory Pattern

    工厂模式专门负责将大量有共同接口的类实例化.工厂模式可以动态决定将哪一个类实例化,不必事先知道每次要实例化哪一个类.工厂模式有以下几种形态: 简单工厂(Simple Factory)模式 工厂方法(F ...

  7. wc，sort，uniq，awk，grep

    wc awk, sort, uniq grep

  8. Range的范围

    range(N,M)的范围应为: [N,M) 例如:

  9. apt-get正在等待报头(waiting for headers)

    可能的解决方法 1. 删除/var/cache/apt/archives/下的所有文件.可能是上次没有成功导致遗留了部分文件. 2. 如果使用的是代理,需要检查DNS.如果机器不能连接DNS服务器,要 ...

  10. redis学习笔记04-事务

    1.redis事务 事务实际上指的是一组命令的集合,执行时会按顺序串行的执行,中途不能加入其它命令.它用来解决批处理需求. 在redis中的基本使用如下: >multi ok >incr ...