《WebKit 技术内幕》学习之五(1): HTML解释器和DOM 模型

第五章 HTML 解释器和 DOM 模型

1.DOM 模型

1.1 DOM标准

        DOM (Document Object Model)的全称是文档对象模型,它可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构。这里的文档可以是 HTML 文档、XML 文档或者 XHTML 文档。DOM 以面向对象的方式来描述文档,在 HTML 文档中,Web 开发者可以使用 JavaScript 语言来访问、创建、删除或者修改 DOM 结构,其主要目的是动态改变 HTML 文档的结构。

        DOM 以面向对象的方式来描述文档(HTML 文档、XML 文档、XHTML 文档)。DOM 定义的是一组与平台、语言无关的接口,该接口允许编程语言动态访问和更改结构化文档。W3C 标准化组织已经定义了 DOM Level 1(1998)、DOM Level 2(2000)、DOM Level 3(2004)、DOM Level 4 等 DOM 接口标准。

使用 DOM 表示的文档被描述成一个树形结构,使用 DOM 的接口可以对 DOM 树结构进行操作。

        DOM 结构构成的基本要素是节点:文档节点(整个文档 Document)、元素节点(HTML 中的标记 Tag)、属性节点(标记的属性)、Entity 节点、ProcessingInstruction 节点、CDataSection 节点、注释(Comment)节点。

        每一级的版本都对以前的版本进行了补充并伴随新功能的加入,每个版本都对 DOM 的不同部分进行了定义。

1.2 DOM 树
(1) 结构模型
        DOM 结构构成的基本要素是 “节点” ,而文档的 DOM 结构就是由层次化的节点组成。在 DOM 模型中,节点的概念很宽泛,整个文档(Document )就是一个节点,称为文档节点。HTML 中的标记(Tag)也是一种节点,称为元素(Element)节点。还有一些其他类型的节点,例如 属性节点(标记的属性)、Entity 节点、ProcessingIntruction 节点、CDataSection 节点、注释(Comment)节点等。

        文档的节点使用IDL语言来描述,文档继承自节点类型,使用Node接口。

        HTML文档的接口定义,都继承自文档的接口,同时又有自己的属性和接口,这些都跟HTML文档的具体应用相关。

(2) DOM 树
        众多的节点按照层次组织构成一个 DOM 树结构,DOM树的根就是HTMLDocument,HTML网页中的标签则被转换成一个个的元素节点。同数据结构中的树形结构一样,这些节点之间也存在父子或兄弟关系。


       树中存在元素节点和文档节点,其实在规范内部还存在属性节点,但不属于元素节点。在图中没有表现出来。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/422543.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

《WebKit 技术内幕》学习之七(4): 渲染基础

4 WebKit软件渲染技术 4.1 软件渲染过程 在很多情况下,也就是没有那些需要硬件加速内容的时候(包括但不限于CSS3 3D变形、CSS3 03D变换、WebGL和视频),WebKit可以使用软件渲染技术来完成页面的绘制工作(除非读者强行…

pytorch学习笔记(十一)

优化器学习 把搭建好的模型拿来训练,得到最优的参数。 import torch.optim import torchvision from torch import nn from torch.nn import Sequential, Conv2d, MaxPool2d, Flatten, Linear from torch.utils.data import DataLoaderdataset torchvision.datas…

《WebKit 技术内幕》学习之六(2): CSS解释器和样式布局

2 CSS解释器和规则匹配 在了解了CSS的基本概念之后,下面来理解WebKit如何来解释CSS代码并选择相应的规则。通过介绍WebKit的主要设施帮助理解WebKit的内部工作原理和机制。 2.1 样式的WebKit表示类 在DOM树中,CSS样式可以包含在“style”元素中或者使…

最全笔记软件盘点!你要的笔记神器都在这里:手写笔记、知识管理、文本笔记、协作笔记等!

在当今的信息化社会中,人们对信息的处理速度越来越快,从工作到生活,我们都面临着大量信息的冲击。在这样的环境下,一个能够帮助我们管理、整理和储存信息的好工具显得尤为重要,而笔记软件恰恰可以满足这些需求。 在选…

中仕教育:国考调剂和补录的区别是什么?

国考笔试成绩和进面名单公布之后,考生们就需要关注调剂和补录了,针对二者之间的区别很多考生不太了解,本文为大家解答一下关于国考调剂和补录的区别。 1.补录 补录是在公式环节之后进行的,主要原因是经过面试、体检和考察&#…

在vscode中悄无声息地摸鱼

想法 作为前端开发者,大多数人都使用 VSCode,并且可能会找一些在 VSCode 中可以摸鱼的插件。我也尝试了一些: Zhihu On VSCode,知乎摸鱼。 daily anime,追番插件。 韭菜盒子,看股票、基金、期货实时数据…

GitHub README-Template.md - README.md 模板

GitHub README-Template.md - README.md 模板 1. README-Template.md 预览模式2. README-Template.md 编辑模式References A template to make good README.md. https://gist.github.com/PurpleBooth/109311bb0361f32d87a2 1. README-Template.md 预览模式 2. README-Templat…

Java 面向对象案例 02 (黑马)

代码: public class foodTest {public static void main(String[] args) {//1、构建一个数组food[] arr new food[3];//2、创建三个商品对象food f1 new food("apple","123",3.2,500);food f2 new food("pear","456",4…

大模型学习之书生·浦语大模型6——基于OpenCompass大模型评测

基于OpenCompass大模型评测 关于评测的三个问题Why/What/How Why What 有许多任务评测,包括垂直领域 How 包含客观评测和主观评测,其中主观评测分人工和模型来评估。 提示词工程 主流评测框架 OpenCompass 能力框架 模型层能力层方法层工具层 支持丰富…

JVM系列-3.类的生命周期

👏作者简介:大家好,我是爱吃芝士的土豆倪,24届校招生Java选手,很高兴认识大家📕系列专栏:Spring原理、JUC原理、Kafka原理、分布式技术原理、数据库技术、JVM原理🔥如果感觉博主的文…

计算机网络学习The next day

在计算机网络first day中,我们了解了计算机网络这个科目要学习什么,因特网的概述,三种信息交换方式等,在今天,我们就来一起学习一下计算机网络的定义和分类,以及计算机网络中常见的几个性能指标。 废话不多…

面试经典 150 题 - 多数元素

多数元素 给定一个大小为 n 的数组 nums ,返回其中的多数元素。多数元素是指在数组中出现次数 大于 ⌊ n/2 ⌋ 的元素。 你可以假设数组是非空的,并且给定的数组总是存在多数元素。 示例 1: 输入:nums [3,2,3] 输出&#xff1…