Document 对象
当浏览器载入 HTML
文档, 它就会成为 Document
对象。
Document
对象是 HTML
文档的根节点。
Document
对象使我们可以从脚本中对 HTML
页面中的所有元素进行访问。
在 HTML DOM (Document Object Model) 中 , 每一个元素都是 节点:
- 文档是一个文档节点
- 所有的
HTML
元素都是元素节点 - 所有
HTML
属性都是属性节点 - 文本插入到
HTML
元素是文本节点。are text nodes - 注释是注释节点
Document不同获取办法
- 对于正常的网页,直接使用
document
或window.document
- 对于
iframe
载入的网页,使用iframe
节点的contentDocument
属性 - 对
Ajax
操作返回的文档,使用XMLHttpRequest
对象的responseXML
属性 - 对于某个节点包含的文档,使用该节点的
ownerDocument
属性。
提示:
Document
对象是Window
对象的一部分,可通过window.document
属性对其进行访问。
Document 对象属性和方法
属性
属性 | 说明 |
document.activeElement | 返回当前获取焦点元素 |
document.anchors | 返回对文档中所有 Anchor 对象的引用 |
document.baseURI | 返回文档的绝对基础 URI |
document.body | 返回文档的body元素 |
document.cookie | 设置或返回与当前文档有关的所有 cookie |
document.doctype | 返回与文档相关的文档类型声明 (DTD) |
document.documentElement | 返回文档的根节点 |
document.domain | 返回当前文档的域名 |
document.referrer | 返回载入当前文档的文档的 URL |
document.links | 返回对文档中所有 Area 和 Link 对象引用 |
document.title | 返回当前文档的标题 |
document.scripts | 返回页面中所有脚本的集合 |
… | … |
方法
方法 | 说明 |
document.write() | 向文档写 HTML 表达式 或 JavaScript 代码 |
document.writeln() | 等同于 write() 方法,不同的是在每个表达式之后写一个换行符 |
document.adoptNode(node) | 从另外一个文档返回 adapded 节点到当前文档 |
document.addEventListener() | 向文档添加句柄 |
document.open() | 打开一个流,以收集来自任何 document.write() 或 document.writeln() 方法的输出 |
document.close() | 关闭用 document.open() 方法打开的输出流,并显示选定的数据 |
document.createAttribute() | 创建一个属性节点 |
document.createComment() | createComment() 方法可创建注释节点 |
document.createDocumentFragment() | 创建空的 DocumentFragment 对象,并返回此对象 |
document.createElement() | 创建元素节点 |
document.createTextNode() | 创建文本节点 |
document.getElementsByClassName() | 返回文档中所有指定类名的元素集合,作为 NodeList 对象 |
document.getElementById() | 返回对拥有指定 id 的第一个对象的引用 |
document.getElementsByName() | 返回带有指定名称的对象集合 |
document.getElementsByTagName() | 返回带有指定标签名的对象集合 |
document.importNode() | 把一个节点从另一个文档复制到该文档以便应用 |
document.normalize() | 删除空文本节点,并连接相邻节点 |
document.normalizeDocument() | 删除空文本节点,并连接相邻节点的 |
document.querySelector() | 返回文档中匹配指定的CSS选择器的第一元素 |
document.querySelectorAll() | document.querySelectorAll() 是 HTML5中引入的新方法,返回文档中匹配的CSS选择器的所有元素节点列表 |
document.removeEventListener() | 移除文档中的事件句柄(由 addEventListener() 方法添加) |
document.renameNode() | 重命名元素或者属性节点 |
… | … |