DOM教程入门手册

开发 前端
文件对象模型(DocumentObjectModel,DOM)是一种理念,一种思想,一种方法使Web开发人员可以访问HTML元素!它只是一种理念,不是具体方法。

这里向大家简单介绍一下DOM的概念,当浏览器支持JavaScript的时候就有DOM了,最早可以追溯到Netscape2。Web开发人员希望访问HTML元素并且改变它们的属性。例如实现HTML元素的淡入淡出这种效果。DOM的功能就是提供这么一种方法来访问HTML元素。

DOM入门教程之什么是DOM(Dom简介)

简单的说,文件对象模型(DocumentObjectModel,DOM)是一种理念,一种思想,一种方法使Web开发人员可以访问HTML元素!它只是一种理念,不是具体方法。那什么是具体方法呢?答案是DHTML

当浏览器支持JavaScript的时候就有DOM了,最早可以追溯到Netscape2。Web开发人员希望访问HTML元素并且改变它们的属性。例如实现HTML元素的淡入淡出这种效果。DOM的功能就是提供这么一种方法来访问HTML元素。精确的规定用什么方法,怎样访问元素。随着浏览器版本的更新,会有更多的权限交给开发人员来操作HTML元素。DOM是给HTML与XML文件使用的一组API。它提供了文件的结构表述(representation),让你可以更动其中的内容及可见物。其本质是建立网页与Script或程序语言沟通的桥梁。

所有网页设计师可操作及建立文件的属性、方法及事件都以[对象]来展现(例如,document就代表「文件本身」这个对象,table对象则代表HTML的表格对象等等)。这些对象可以由当今大多数的浏览器以Script来取用。

DOM最常被用以[与JavaScript沟通],也就是说虽然程序以JavaScript写成,但使用DOM来存取页面及其元素。无论如何,DOM本身是设计为一种独立的程序语言,以一致的API存取文件的结构表述;是以虽然本站的焦点放在JavaScript上,但DOM其实可以与[任何程序语言]共同运作。

[全球信息网协会](WorldWideWebConsortium,W3C)建立了[DOM]的标准,称之为「W3CDOM」。在当今主要浏览器都已正确实作的情况下,W3CDOM使强大、跨浏览器的应用程序成真。这是众网页设计师在Netscape4与MSIE多不相容的时代从未梦想过的事情。

DOM结构:

  在DOM中,我们将代表XML文件的程序设计对象,称为节点(nodes)。当InternetExplorer5处理被链接的XML文件并储存于DOM中时,它会为XML文件的每一个基本组件建立一个节点。这些基本组件包括了元素、属性,与处理指令DOM会使用不同形态的节点来代表不同形态的XML组件。例如,元素是储存在Element节点中,而属性则是储存在Attribute节点中。表格1列出了这些节点类型最重要的部分。

节点形态节点对象所代表的XML文件组件节点名称(nodeName对象属性)节点的值(nodeValue对象属性)文件(Document)文件阶层中的根节点(代表整个XML文件)#documentNull元素(Element)元素元素形态名称(例如,BOOK)null(包含在元素中的(Element)任何字符数据,是位在一个或多个子文字节点中)文字(Text)属于由这个节点的父节点所代表的元素,属性及实体的文字。

#text父XML组件的文字属性(Attribute)属性(以及其它的名值对,像处理指令中的名字与值)属性名称(如Binding)属性值(例如hardcover)处理指令(ProcessingInstruction)处理指令(XML宣告或自订的处理指令)处理指令的目标(例如xml)除了目标之外整个处理指令的内容(例如,Version"1.0")批注(Comment)批注#comment在批注符号中的文字CDATA区段(CDATASection)CDATA区段#cdata-sectionCDATA区段中的内容文件类型(DocumentType)文件形态宣告出现在DOCTYPE宣告中的根元素的名字(例如INVENTORY)Null实体(Entity)DTD中的实体宣告实体名称(例如image)null(实体值是位在子文字节点中)标签DTD中的标签宣告标签名称(例如BMP)>null(卷标的系统literal(Notation)是位在名为SYSTEM的子Attribute上表中用来表示不同XML文件组件的基本节点形态。这些类型的每一个节点都是一个程序设计对象,提供了存取相关组件的属性与方法。

你可以从节点中的nodeName属性获得每个节点的名称。这个名称是以字符#起始,代表那些未在文件中命名的XML组件节点的标准名称。(例如,在XML文件中的批注并未命名。因此,DOM将使用标准名称#comment。)其它节点的名称则是由指定到XML文件中相对应组件的名称衍生而来。(例如,代表形态BOOK元素的元素节点也可以命名为BOOK。)

你可以从节点的nodeValue属性取得每个节点的节点值。如果XML组件拥有一个相关的值(例如,属性),该值将会被储存于节点的节点值中。如果XML组件并没有节点值(例如,元素),则DOM将会把节点值设成null。

【编辑推荐】

  1. 探究DOM API用法
  2. JQuery创建DOM元素方法解析
  3. JavaScript获取HTML DOM节点元素详解
  4. JavaScript和DOM轻松实现数据访问
  5. HTML DOM与XML DOM的区别与联系探究
责任编辑:佚名 来源: wbsz.com
相关推荐

2010-09-28 09:33:25

DOM模型

2010-09-13 13:58:17

HTML DOM

2010-06-08 16:23:22

UML教程

2010-05-21 12:37:49

SVN使用教程

2010-09-28 10:44:30

HTML DOM参考手

2010-08-31 08:59:06

marginHTML

2010-06-13 14:01:50

UML学习入门

2009-09-25 13:48:17

Hibernate i

2010-09-09 13:40:19

XML DOM

2010-07-20 13:19:16

Perl入门手册

2009-09-24 15:03:30

Hibernate配置

2010-07-16 17:23:57

Perl面向对象编程

2010-05-12 14:12:44

Meego开发

2010-07-26 11:19:19

Perl入门手册

2012-03-06 15:41:16

jQuery MobijQuery Mobi手册

2010-07-26 14:39:08

PerlHash

2020-10-15 09:49:45

HarmonyOS 2设备开发

2012-03-01 22:50:55

Linux范例

2010-11-23 11:21:25

Microsoft L

2012-02-29 00:38:29

Linux命令
点赞
收藏

51CTO技术栈公众号