HTML DOM 简介

godict
godict
管理员
969
文章
0
粉丝
网络周边阅读模式

?什么是 DOM?
通过 Javascript,您可以重构整个 HTML 文档。您可以添加、移除、改变或重排页面上的项目。
要改变页面的某个东西,Javascript 就需要获得对 HTML 文档中所有元素进行访问的入口。这个入口,连同对 HTML 元素进行添加、移动、改变或移除的方法和属性,都是通过文档对象模型来获得的(DOM)。
在 1998 年,W3C 发布了第一级的 DOM 规范。这个规范允许访问和操作 HTML 页面中的每一个单独的元素。
所有的浏览器都执行了这个标准,因此,DOM 的兼容性问题也几乎难觅踪影了。
DOM 可被 Javascript 用来读取、改变 HTML、XHTML 以及 XML 文档。

什么是文档(Ducument)?
文档就是一段合法的XML串或一段HTML,在概念上文档应该有根以便能访问到里面的数据。

DOM的级别
DOM Level 1,DOM Level 1第一版又分成DOM Level 1 Core和DOM Level 1 HTML。
DOM Level 1 Core定义了一组最基本的访问和操作文档的对象和接口,是一种满足所有软件开发者和web脚本开发者访问和操作HTML、XML的功能性规范。
DOM Level 1 HTML继承了DOM Level 1 Core,主要描述HTML文档方面的对象和方法。一般来说,DOM Level 1 HTML要能实现维护结构化的文档、元素和属性。

DOM Level 2,DOM Level 2又分成DOM Level 2 Core、DOM Level 2 Views、DOM Level 2 Events、DOM Level 2 Style、DOM Level 2 Traversal and Range Specification、DOM Level 2 HTML。在这里我只关注Core和HTML。
DOM Level 2 Core和Level 1的定义一样,并基于Level 1构建。
DOM Level 2 HTML基于DOM Level 2 Core构建,且不与DOM Level 1 HTML兼容,DOM Level 2 HTML也是目前HTML 4.01和XHTML 1.0所采用的级别。

DOM Level 3,在这里就不多描述了,目前还没有DOM Level 3 HTML规范,我看DOM Level 3 Core的描述还是针对HTML 4.01的,难道是在等传说中的HTML 5?对于HTML 5的相互争论是可以的,奉劝各大浏览器厂商不要把头打破了。

HTML DOM对象包括所有的标签,例如就是一个DOM对象,HTML中的标签(元素)实际上是实现了DOM Level 2 HTML的HTMLAnchorElement接口,再比如

标签(分组元素)实现了HTMLDivElement接口。既然DOM Level 2 HTML和HTML 4.01关系紧密,那么可以存在:document.createElement(“div”)来创建DIV对象。可参考HTML 4.01规范来找寻其支持的元素。对于span这样的分组元素在DOM Level 2 HTML中是实现了HTMLElement接口,与span一样实现HTMLElement接口的元素是:
特殊: SUB, SUP, SPAN, BDO
字体: TT, I, B, U, S, STRIKE, BIG, SMALL
表达: EM, STRONG, DFN, CODE, SAMP, KBD, VAR, CITE, ACRONYM, ABBR
列表: DD, DT
NOFRAMES, NOSCRIPT
ADDRESS, CENTER
这里面最特殊的DOM对象是document,它实现了HTMLDocument接口且没有对应的HTML标签,HTMLDocument是整个HTML层次的根并能处理HTML的所有内容。

除了内置与HTML对应的对象外,HTML DOM(浏览器)中还内置了Javascript对象,他们是:Window、Navigator、Screen、History、Location,可阅读HTML DOM 参考手册,里面解释得很清楚。需要说明的是:Window 对象表示一个浏览器窗口或一个框架。在客户端 Javascript 中,Window 对象是全局对象,所有的表达式都在当前的环境中计算。也就是说,要引用当前窗口根本不需要特殊的语法,可以把那个窗口的属性作为全局变量来使用。例如,可以只写 document,而不必写 window.document,还有用得最多的alert()方法,也不用写Window.alert()。

文章末尾固定信息

我的微信
这是我的微信扫一扫
weinxin
我的微信
微信号已复制
我的微信公众号
我的微信公众号扫一扫
weinxin
我的公众号
公众号已复制
 
godict
  • 本文由 godict 发表于2010年6月10日 22:59:52