3.0 第3章 jQuery中的DOM操作 3.1 DOM操作的分类

第3章 jQuery中的DOM操作

DOM是 Document Object Model的缩写,意思是文档对象模型。根据 W3CDOM 规范(http://www.w3.org/DOM),DOM是一种与浏览器、平台、语言无关的接口,使用该接口可以轻松地访问页面中所有的标准组件。简单来说,DOM解决了Netscape的JavaScript和Microsoft的JScript之间的冲突,给予了Web 设计师和开发者一套标准的方法,让他们能够轻松获取和操作网页中的数据、脚本和表现层对象。

3.1 DOM操作的分类

一般来说,DOM操作分为3个方面,即DOM Core(核心)、HTML-DOM和CSS-DOM。

1.DOM Core

DOM Core并不专属于JavaScript,任何一种支持DOM的程序设计语言都可以使用它。它的用途并非仅限于处理网页,也可以用来处理任何一种使用标记语言编写出来的文档,例如XML。

JavaScript 中的getElmentById()、getElementsByTagName()、getAttribute()和setAttribute()等方法,这些都是DOM Core的组成部分。

例如:

  • 使用DOM Core来获取表单对象的方法:

[插图]

  • 使用DOM Core来获取某元素的src属性的方法:

[插图]

2.HTML-DOM

在使用JavaScript和DOM为HTML文件编写脚本时,有许多专属于HTML-DOM的属性。HTML-DOM的出现甚至比DOM Core还要早,它提供了一些更简明的记号来描述各种HTML元素的属性。

例如:

  • 使用HTML-DOM来获取表单对象的方法:

[插图]

  • 使用HTML-DOM来获取某元素的src属性的方法:

[插图]

通过上面所说的方法,可以发现获取某些对象、属性既可以用DOM Core来实现,也可以使用HTML-DOM实现。相比较而言HTML-DOM的代码通常比较简短,不过它只能用来处理Web文档。

3.CSS-DOM

CSS-DOM是针对 CSS的操作。在JavaScript中,CSS-DOM技术的主要作用是获取和设置style对象的各种属性。通过改变style对象的各种属性,可以使网页呈现出各种不同的效果。

例如:设置某元素style对象字体颜色的方法:

[插图]

jQuery作为JavaScript库,继承并发扬了JavaScript对DOM对象的操作的特性,使开发人员能方便地操作DOM对象。下面详细介绍jQuery中的各种DOM操作。