JavaScript Document对象

一、HTML DOM Document 对象

在 HTML DOM (Document Object Model) 中 , 每一个元素都是节点:

当浏览器载入 HTML 文档, 它就会成为 Document 对象。

Document 对象是 HTML 文档的根节点。

Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。

提示：Document 对象是 Window 对象的一部分，可通过 window.document 属性对其进行访问。

打印document对象显示：

二、Document 对象集合

三、Document 对象属性

属性	描述
body	提供对 <body> 元素的直接访问。对于定义了框架集的文档，该属性引用最外层的 <frameset>。
cookie	设置或返回与当前文档有关的所有 cookie。
domain	返回当前文档的域名。
lastModified	返回文档被最后修改的日期和时间。
referrer	返回载入当前文档的文档的 URL。
title	返回当前文档的标题。
URL	返回当前文档的 URL。
baseURI	返回绝对基础URI
doctype	返回文档声明类型DTD
documentElement	返回文档根节点
DOCUMENT_NODE	适用于通过浏览器渲染文档的模式
documentURI	设置活返回文档的位置
referrer	返回载入当前文档的文档的URL
readyState	返回当前文档的载入状态 uninitialized - 还未开始载入 loading - 载入中 interactive - 已加载，文档与用户可以开始交互 complete - 载入完成
inputEncoding	返回文档的编码方式
activeElement	返回文档的焦点元素注意：该属性是只读的。提示：为元素设置焦点，可以使用 element.focus() 方法。提示：可以使用 document.hasFocus() 方法来查看当前元素是否获取焦点。

四、Document 对象方法

方法	描述
close()	关闭用 document.open() 方法打开的输出流，并显示选定的数据。
getElementById()	返回对拥有指定 id 的第一个对象的引用。
getElementsByName()	返回带有指定名称的对象集合。
getElementsByTagName()	返回带有指定标签名的对象集合。
open()	打开一个流，以收集来自任何 document.write() 或 document.writeln() 方法的输出。
write()	向文档写 HTML 表达式或 JavaScript 代码。
writeln()	等同于 write() 方法，不同的是在每个表达式之后写一个换行符。

//write(); 支持html 的输出
document.write('测试内容');
document.write('<h1>标题内容</h1>');
document.write("<script> alert('测试代码'); </script>");

五、DOM 文档节点操作常用方法

1.查找节点

document.querySelector()	返回文档中匹配指定的CSS选择器的第一元素
document.querySelectorAll()	document.querySelectorAll() 是 HTML5中引入的新方法，返回文档中匹配的CSS选择器的

2.创建节点

document.createAttribute()	创建一个属性节点
document.createComment()	createComment() 方法可创建注释节点。
document.createDocumentFragment()	创建空的 DocumentFragment 对象，并返回此对象。
document.createElement()	创建元素节点。
document.createTextNode()	创建文本节点。

document.normalize()	删除空文本节点，并连接相邻节点
document.normalizeDocument()	删除空文本节点，并连接相邻节点的

重命名元素或者属性节点。

把一个节点从另一个文档复制到该文档以便应用。

4.节点事件处理

向文档添加句柄

移除文档中的事件句柄(由 addEventListener() 方法添加)