JavaScript快速入门（六）——DOM

2024-04-27 14:12:50

字体：大中小

来源：转载

供稿：网友

javaScript快速入门（六）——DOM

概念扫盲

DOM

DOM是 Document Object Model（文档对象模型）的缩写，是W3C（万维网联盟）的标准。DOM 定义了访问 HTML 和 xml 文档的标准：“W3C 文档对象模型（DOM）是中立于平台和语言的接口，它允许程序和脚本动态地访问和更新文档的内容、结构和样式。”W3C DOM 标准被分为 3 个不同的部分：

核心 DOM - 针对任何结构化文档的标准模型
XML DOM - 针对 XML 文档的标准模型
HTML DOM - 针对 HTML 文档的标准模型

这篇文章主要讲HTML DOM

HTML DOM

HTML DOM 是：

HTML 的标准对象模型
HTML 的标准编程接口
W3C 标准

HTML DOM 定义了所有 HTML 元素的对象和属性，以及访问它们的方法。换言之，HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准。

Javascript DOM

前面讲过，DOM定义了访问HTML和XML文档的标准：“W3C 文档对象模型（DOM）是中立于平台和语言的接口，它允许程序和脚本动态地访问和更新文档的内容、结构和样式。”注意粗体字部分，DOM是中立于平台和语言的接口，也就是任意平台、任意语言中，都有相应的DOM接口。但在我们这篇文章中，我们主要的还是采用浏览器平台、JavaScript语言中的DOM接口来做阐述，这也是目前使用最频繁的接口了。只是想提醒大家，不要以偏概全，认为只有JavaScript中的DOM才是真正的DOM。下文中，我们说的DOM接口也全部是JavaScript DOM和HTML DOM中的内容。学习这部分需要大家对HTML、CSS、JS有基础的认识和了解。

DOM树

简单的DOM树

我们之前说过一句话，也希望大家记住这句话：“有嵌套的地方就有父子关系。”HTML中允许嵌套，并且允许多重嵌套，多种父子关系就形成了一棵树，我们叫它DOM树。我们先来看一份简单的HTML代码：

<html><head><title>文档标题</title></head><body><a href="#">我的链接</a>        <h1>我的标题</h1></body></html>

它的DOM树是这样的： HTML DOM Node Tree

节点关系

基本的节点关系有父子、同胞，衍生出来的有祖先—后代。父节点我们用parent表示，子节点用child，同胞用sibling。

在节点树中，顶端节点被称为根（root）
每个节点都有父节点、除了根（它没有父节点）
一个节点可拥有任意数量的子
同胞是拥有相同父节点的节点

我们将刚才的DOM树截取掉一部分， DOM 节点关系

这样就比较清楚了。

节点类型

文档的不同组成部分有不同的节点类型，共有12种，具体如下：

节点类型值

节点类型

描述

子节点

Element

代表元素

Element, Text, Comment, PRocessingInstruction, CDATASection, EntityReference

Attr

代表属性

Text, EntityReference

Text

代表元素或属性中的文本内容。

None

CDATASection

代表文档中的 CDATA 部分（不会由解析器解析的文本）。

None

EntityReference

代表实体引用。

Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference

Entity

代表实体。

Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference

ProcessingInstruction

代表处理指令。

上一篇：JavaScript的原型继承

下一篇：javascript正则表达式简介

学习交流

硬盘分区如何设置准确的分区空间

硬盘分区如何设置准确的分区空间...

热门图片

猜你喜欢的新闻

猜你喜欢的关注

新闻热点

英伟达市值一夜大涨9246亿创2023年5月以来最大单周涨幅

2024-04-27 13:35:46

雷军：小米正在申请3万件专利，以提升自身的竞争力

2024-04-27 13:33:47

人参泡酒15年后竟“复活”？网友：这酒还能喝不？

2024-04-24 22:53:44

芯片股普涨！英伟达市值一夜大涨6000亿元

2024-04-23 19:32:50

面馆老板1天卖100碗刚够交房租要卖到150碗才能实现盈利

2024-04-23 19:25:50

跌近30%！茶百道上市一小时跌没3年净利润

2024-04-23 19:13:19

疑难解答

图片精选

网友关注