`
哈达f
  • 浏览: 120360 次
  • 性别: Icon_minigender_1
  • 来自: 广西
社区版块
存档分类
最新评论

DOM简介

    博客分类:
  • DOM
 
阅读更多
DOM(document Object model)文档对象模型。
其实就是将一些标记型的文档以及文档中的内容当成对象。
为什么要将这些文档以及其中的标签封装成对象呢?
因为可以在对象中定义其属性和行为,可以方便操作这些对象。

DOM在封装标记型文档时,有三层模型。
DOM1:针对html文档。
DOM2:针对xml文档
DOM3:针对xml文档




html,xhtml,xml:这些都是标记型文档。

DHTML:是多个技术的综合体。叫做动态的html。
	html:负责将数据进行标签的封装。
	css:负责标签的样式。
	dom:负责将标签以及标签中的数据封装成对象。
	javascript:负责通过程序设计方式来操作这些对象。

标签之间存在着层次关系:
window
	|--
	|--
	|--


document
html
     |--head
	|--title
	|--base
	|--link
	|--meta
	|--style
	|--script
     |--body
	|--div
	|--form
		|--input
		|--select
	|--span
	|--a
	|--table
		|--tbody
		    |--tr
			|--td
			|--th
	|--dl
	   |--dt
	   |--dd

通过这个标签层次,可以形象的看作是一个树型结构。那么我也称标记型文档,加载进内存的是一颗DOM树。
这些标签以及标签的数据都是这棵树上的节点。

当标记型文档加载进内存,那么内存中有了一个对应的DOM树。

DOM对已标记型文档的解析有一个弊端就是文档过大,相对消耗资源。
对于大型文档可以使用SAX这种方式解析。

节点类型:
标签型节点:类型:1
属性节点:类型 : 2
文本型节点:类型:3
注释型节点:类型:8
document: 类型 9。



注意:标签之间存在空行时,会出现一个空白的文本节点,在获取节点时一定要注意。


节点的关系:
父节点,parentNode
子节点。childNodes:直接子节点。返回的是一个节点对象数组。
兄弟节点
	上一个兄弟节点。previousSibling
	下一个兄弟节点。nextSibling



---------------------

获取可以通过节点的层次关系完成。


也可以通过document对象完成。
getElementById :通过id属性值获取对应的节点对象。如果有多一个id值相同。获取到的是第一个id所属对象。
		尽量保证ID唯一性。返回的是一个对象。
getElementsByName :
		通过标签的name属性值获取对象。返回的一堆对象。其实是一个对象数组。


getElementsByTagName :即没有id也没有name时,可是通过标签名来获取节点对象。返回的是一堆对象。其实是一个对象数组。
			大多容器型标签都具备该方法。


 

分享到:
评论

相关推荐

    HTML DOM简介.rar

    目录如下: 1. DOM可以做什么? 2. DOM的结构 3. 访问DOM节点1——getElementById() 4. 访问DOM节点2——getElementsByTagName() 5. 访问DOM节点3——通过节点关系 6. DOM节点信息 ...11. DOM简介总结

    HTML DOM基础教程(网页形式)

    DOM 简介 DOM 节点 DOM 节点树 DOM 节点访问 DOM 节点信息 DOM How To DOM 参考 DOM 总结 DOM 实例 DOM 实例 DOM 对象 DOM Window DOM Navigator DOM Screen DOM History DOM Location DOM Document ...

    DOM和BOM的使用

    DOM 简介 DOM 是一个平台中立、语言中立的接口,它允许开发者通过 JavaScript 操作文档的内容和结构。DOM 将 HTML 文档抽象为一个树形结构,文档中的每个元素都是一个节点,节点之间通过父子关系连接。DOM 提供了...

    【学习 XML DOM】.pdf

    XML DOM 简介: XML DOM 提供了一种平台和语言中立的接口,允许开发者通过编程方式访问和修改XML文档的结构和内容。DOM 分为三个不同的部分或级别:核心DOM,适用于任何结构化文档;XML DOM,专门针对XML文档;以及...

    程序员为什么还要刷题-html-dom:HTML和DOM简介。[html,dom]

    简介 目录 学习目标 使用 HTML 构建一个简单的网页 解释 HTML 文档的各个部分,包括: <head>和<body>标签 容器元素,例如 、 、 、 和 常见元素,例如 、 、 、 和 解释HTML和DOM之间的区别 准备 ...

    张龙 Schema DOM笔记

    1. **DOM简介**: - **DOM**(Document Object Model)是指文档对象模型。 - 是一种标准接口规范,用于处理XML数据。 - 提供了一种与语言无关、与平台无关的方法来访问和修改XML文档的内容。 2. **DOM的应用**:...

    传播智客扬中科老师讲的DOM 学习笔记

    ### DOM简介 DOM是一种处理HTML和XML文档的标准接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样式。DOM将文档视为树结构,每个节点代表文档中的某个部分,如元素、属性或文本。 ### DOM选择器与节点...

    Javascript DOM编程艺术(中文版)

    **1.1 DOM简介** DOM(Document Object Model)即文档对象模型,是一种与平台和语言无关的接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样式。DOM 主要用于 HTML 和 XML 文档。 **1.2 DOM的层次结构**...

    XML DOM教程

    **XML DOM 简介** DOM将XML文档解析为一个节点树,其中每个元素、属性、文本块等都是一个独立的节点。这个模型使得开发者可以通过JavaScript或其他支持DOM的语言来访问和操作文档的任何部分。DOM的核心在于它的树状...

    dom解析基本操作删除 修改……

    #### 一、DOM简介 DOM (Document Object Model) 是一种用于处理结构化文档的标准接口,它能够以树形结构表示文档,并提供了一套API来访问、修改和创建这些结构化的文档对象。在Java中,DOM是通过一系列的类库实现的...

    关于dom和jquery对象理解

    #### DOM简介 在探讨DOM与jQuery之间的关系之前,我们首先需要明确什么是DOM(Document Object Model)。DOM是一种用于表示HTML或XML文档的标准接口,它提供了一种方式来读取、操作文档中的元素、属性以及文本。...

    W3C DOM模型参考手册

    #### 二、DOM简介 ##### 2.1 什么是DOM? DOM是一种标准,用于将XML或HTML文档表示为树形结构,使得程序和脚本能够轻松地改变文档的内容、结构和样式。通过DOM,开发者可以访问文档中的每个元素,并对它们进行操作...

    html—dom教程

    #### 一、HTML DOM 简介 - **基础知识**:在学习HTML DOM之前,建议读者掌握HTML/XHTML和JavaScript的基本知识。 - **DOM 定义**:DOM(Document Object Model)是一种平台和语言中立的接口,它使程序和脚本能够动态...

    dom4j使用简介

    **DOM4J使用简介** DOM4J 是一个强大的 Java 库,专为处理 XML 文档而设计。它提供了丰富的 API,使得在 Java 中解析、创建、修改 XML 文件变得简单高效。DOM4J 不仅支持 DOM(文档对象模型)和 SAX(简单API for ...

    JavaScript DOM学习第一章 W3C DOM简介

    在这一章我主要介绍已经被新一代的浏览器所支持的W3C 第一级的DOM。对他的运作做一个大概的了解并且让你知道你可以对他们做什么。 首先是对于DOM的一些建议和DOM设计的目的,然后我会告诉你什么是节点(nodes)并且...

    使用DOM合理操作JS

    #### 一、DOM简介 **DOM**,即**Document Object Model**(文档对象模型),是一项由W3C(World Wide Web Consortium,万维网联盟)组织制定的应用编程接口,用于处理HTML、XML等文档。通过DOM,开发者能够以一种...

    dom生成xml文件

    #### 一、XML与DOM简介 **XML (Extensible Markup Language)** 是一种标记语言,用于定义结构化的文档格式。它具有跨平台性,并且被广泛应用于数据交换、配置文件以及文档存储等领域。XML文档通常包含一系列嵌套的...

    DOM Scripting Web Design JavaScript and the Document Object Model (2nd)

    #### 二、DOM简介 **文档对象模型**(Document Object Model,简称DOM)是一种与平台和语言无关的应用程序接口(API),它定义了如何在XML或HTML文档中表示、修改和查询数据。通过DOM,开发者可以轻松地访问页面中的元素...

    axiom-dom-1.2.8.jar.zip

    一、Axiom DOM简介 Axiom DOM是一个基于StAX(Streaming API for XML)的高性能XML处理库,它为开发者提供了构建和操作DOM树的能力。与传统的DOM实现相比,Axiom DOM更注重性能和内存效率,特别适合处理大型或复杂...

Global site tag (gtag.js) - Google Analytics