文档对象模型(DOM)
了解 DOM 的意义何在?其实,我觉得现代浏览器的差异越来越小,只在一些特殊的情况,再者,现在的前端框架也都尽力做到浏览器兼容。但是多多少少了解 DOM 还是有益无害的,因为它关系到前端框架的底层实现。因此,不能忽视 DOM,但也无需投入过多精力。
本文内容
- HTML 相关
- 为什么要使用 DOM
- DOM 级别
- Web 浏览器对 DOM 的支持
- 文档模式
HTML 相关
HTML |
|
XHTML |
|
HTML 5 |
|
DHTML 不应该在上面的表格里,因为它是一种创建动态和交互 WEB 站点的技术集。对大多数人来说,DHTML 意味着 HTML、样式表和 JavaScript 的组合。
为什么要使用 DOM
有了 JavaScript,若想让 JavaScript 更好地操作 HTML,结构化 HTML 是必然的。这样才能更容易地在页面加载后,修改页面的外观和内容。
自 Internet Explorer 4 和 Netscape Navigator 4 开始,开发人员首次可以实现这一理想。然而,DHTML 在给 Web 技术发展带来巨大进步的同时,也带来了巨大的问题。因为 Netscape 和微软在发展 DHTML 上各自为战。因此,若想保持 Web 的跨平台性,开发人员不得不做很多额外的工作。更重要的是,这种竞争最终会造成浏览器互不兼容的局面。
于是,W3C 开始着手规划文档对象模型(DOM)。
DOM 级别
DOM 级别 0 | DOM 级别 0 不是 W3C 规范。而仅仅是对在 Netscape Navigator 3.0 和 Microsoft Internet Explorer 3.0 中的等价功能性的一种定义。 DOM 发展过程中的关键角色有:ArborText、IBM、Inso EPS、JavaSoft、Microsoft、Netscape、Novell、the Object Management Group、SoftQuad、Sun Microsystems 以及 Texcel。 W3C 的 DOM 级别 1 建立于此功能性之上。 |
DOM 级别 1 | DOM 级别 1 专注于 HTML 和 XML 文档模型。它含有文档导航和处理功能。 DOM 级别 1 于 1998 年 10 月 1 日成为 W3C 推荐标准。 第二版的工作草案在 2000 年 9 月 29 日。 |
DOM 级别 2 | DOM 级别 2 对 DOM 级别 1 添加了样式表对象模型,并定义了操作附于文档之上的样式信息的功能性。 DOM 级别 2 同时还定义了一个事件模型,并提供了对 XML 命名空间的支持。 作为一项 W3C 推荐标准,DOM 级别 2 规范发布于 2000 年 11 月 13 日:
|
DOM 级别 3 | DOM Level 3 规定了内容模型 (DTD 和 Schemas) 和文档验证。同时规定了文档加载和保存、文档查看、文档格式化和关键事件。DOM Level 3 建立于 DOM Core Level 2 之上。 DOM Level 3 Requirements DOM Requirements 文档已经为 Level 3 requirements 进行了更新,并于 2000 年 4 月 12 日发布为工作草案。 下面的 DOM Level 3 工作草案发布于 2000 年 9 月 1 日:
|
Web 浏览器对 DOM 的支持
下表列出主流浏览器对 DOM 标准的支持。
浏览器 | DOM 兼容性 |
Netscape Navigator 1. - 4.x | - |
Netscape Navigator 6+(Mozilla 0.6.0+) | 1 级、2 级(几乎全部)、3 级(部分) |
Internet Explorer 2 – 4.x | - |
Internet Explorer 5 | 1 级(最小限度) |
Internet Explorer 5.5 - 7 | 1 级(几乎全部) |
Opera 1 - 6 | - |
Opera 7 – 8.x | 1 级(几乎全部)、2 级(全部) |
Opera 9+ | 1 级、2 级(几乎全部)、3 级(全部) |
Safari 1.0.x | 1 级 |
Safari 2+ | 1 级、2 级(全部) |
Chrome 0.2+ | 1 级、2 级(全部) |
Firefox 1+ | 1 级、2 级(几乎全部)、3 级(全部) |
文档模式
直到 IE 5.5 才引入文档模式的概念,而这个概念是通过使用文档类型(doctype)切换实现的。
如:XHTML 1.0 过渡型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
最初的两种文档模式是:
- 混杂模式(quirks mode)
- 标准模式(standards mode)
混杂模式会让 IE 的行为与(包括非标准特性)IE 5 相同,而标准模式则让 IE 的行为更接近标准行为。虽然这两种模式主要影响 CSS 内容的呈现,但在某些情况下,也会影响 JavaScript 的解释执行。
之后,IE 又提出一种所谓的准标准模式(almost standards mode)。在这种模式下的浏览器特性很多都符合标准,不标准的地方主要体现在处理图片间隙的时候(在表格中使用图片时问题最明显)。
如果在文档开始处没有发现文档类型声明,则所有浏览器都会默认开启混杂模式。但不推荐采用混杂模式,因为不同浏览器在这种模式下的行为差异非常大,如果不使用某些浏览器兼容的技术,跨浏览器的行为根本没有一致性可言。
准标准模式与标准模式非常接近,它们的差异几乎可以忽略不计。
IE 8 又引入了一种新的文档模式,叫超级标准模式。超级文档模式可以让 IE 以其所有版本中最符合标准的方式来解释页面内容。
总的看来,
- 混杂模式让 IE 更像 IE 5。
- 标准模式使用 IE 7 的呈现引擎。
- 超级标准模式使用 IE 8 的默认文档模式。不过可以关闭其默认文档模式,指定哪个版本的呈现引擎来呈现页面。如:<meta http-equiv=”X-UA-Compatible” content=”IE=7”>。超级标准模式与标准模式一般也不会有什么差别。
参考