Dom Document节点类型详解

在前面 DOM 概况 中,我们知道了 DOM 总共有 12 个节点类型,今天我们就来讲下 DOM 中最重要的节点类型之一的 document 节点类型。

1、概况


Javascript 通过 Document 类型表示文档。在浏览器中, document 对象是 HTMLDocument(继承自 Document 类型)的一个实例,表示整个 HTML 页面。而且, document 对象是 window 对象的一个属性,因此可以将其作为全局对象来访问。 Document 节点具有如下特性:

  1. nodeType 的值为 9
  2. nodeName 的值为 ‘#document’
  3. nodeValue 的值为 null
  4. parentNode 的值为 null
  5. ownerDocument 的值为 null
  6. 其子节点可能是一个 DocumentType(最多一个)、Element(最多一个)、ProcessingInstruction 或者 Comment

Document 类型可以表示 HTML 页面或者其他基于 XML 的文档。不过最常见的应用还是作为 HTMLDocument 实例的 document 对象。通过这个文档对象,不仅可以取得与页面有关的信息,而且还能操作页面的外观及其底层结构。

2、文档的子节点


虽然 DOM 标准规定 Document 节点的子节点可以是 DocumentType(最多一个)、Element(最多一个)、ProcessingInstruction 或者 Comment,但还是有两个内置的访问其子节点的快捷方式。第一个就是 documentElement 属性,该属性始终指向 HTML 页面中的 <html> 元素,另一个就是通过 childNodes 列表访问文档元素:(假设没有指定文档类型)

作为 HTMLDocument 的实例,document 对象还有一个 body 属性,直接指向 <body> 元素。

所有的浏览器都支持 document.documentElement 和 document.body 属性

Document 另一个可能的子节点是 DocumentType。通常将 <!DOCTYPE> 标签看成一个和文档其他部分不同的实体,可以通过 doctype 属性来访问它的信息:

但是浏览器对 document.doctype 的支持差别很大,使得这个属性的用处很有限。

文档的子节点还能是注释节点:

但是,现实中的浏览器在处理位于 <html> 外部的注释方面存在差异,比如 chrome 下就直接忽视上面的第二个注释节点。

3、文档信息


作为 HTMLDocument 的一个实例,document 对象还有一些标准的 Document 对象所没有的属性。

domain 属性是可以设置的,这点在跨域通信中应用甚广。由于安全方面的考虑,也并非可以给 domain 设置任何值。

浏览器对 domain 属性还有一个限制,即如果域名一开始是 “松散的”,那么不能再将它设置为 “紧绷的”:

4、查找元素

5、特殊集合


除了属性和方法,document 对象还有一些特殊的集合,这些集合都是 HTMLCollection 对象,为访问文档常用的部分提供了快捷方式:

打赏支持我写出更多好文章,谢谢!

打赏作者

打赏支持我写出更多好文章,谢谢!

1 1 收藏 评论

关于作者:韩子迟

a JavaScript beginner 个人主页 · 我的文章 · 9 ·    

相关文章

可能感兴趣的话题



直接登录
跳到底部
返回顶部