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. Linux的基本原则

    Linux的基本原则:1.由目的单一的小程序组成,一个程序只做一件事,且做好: 2.’组合小程序完成复杂任务: 3.一切皆文件: 4.尽量避免捕获用户接口: 5.配置文件保存为纯文本格式: 6.提供机 ...

  2. webGL动画

    在做这个项目之前,我也和很多人的想法一样觉得:H5做动画性能不行,只能完成简单动画,可是事实并非如此.所以借此篇分享振奋下想在H5下做酷炫游戏的人心. 体验游戏请长按二维码识别: 好吧,知道你懒.不想 ...

  3. 引用不了XXservice,怎么办？

    1.tEdasArchiveLogService = (TEdasArchiveLogService) SpringContextHolder.getBean("TEdasArchiveLo ...

  4. 【牛客挑战赛31D】 雷的打字机

    题目 首先看到这个出现长度至少为\(2\)的回文子串 这就等价于不能出现两个连续且相同的字符 于是我们用概率生成函数来搞 设\(g_i\)表示\(i\)次操作后游戏没有结束的概率,\(f_{i,j}\ ...

  5. Tornado demo3 - tcpecho分析

    在这个demo中,主要是使用了Tornado中异步的TCP client和server来实现一个简单的echo效果(即客户端发送的message会从server端返回到client).代码的githu ...

  6. HLog工作原理

  7. windows API 第 18篇 FindFirstVolume FindNextVolume

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

  8. [转]WPF更换主题

    如果要做到一个应用程序其基本的内容不变,但改变整个应用程序的外观可以这样做: 对于每一套外观定义一个ResourceDictionary 在应用程序中,动态加载此应用程序(或窗体)的Resource ...

  9. List--列表合成

    1,基本规则是,一对中括号里面包含一个表达式,表达式里可以有for语句,还可以有分支的for或者if语句. 2,例如: 3,列表合成可以快速地合并多个列表. 例如: 当然还可以直接加:[1, 2, 3 ...

  10. HZOI20190820模拟27题解

    A. 小奇挖矿2 显然的O(m)dp:$f[i]=max(f[i-4],f[i-7])+a[i]$,当然你要保证i,i-4,i-7都能到达 #include<iostream> #incl ...