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

news2024/11/16 5:37:12

第五章 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.coloradmin.cn/o/1403649.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

MarkDown学习笔记 直观全面详细

前言 为什么我们要学习Markdown呢?因为Markdown简单易学易上手,可以以纯文本格式编写文档,然后转换成有效的HTML文档,并且以导出 HTML 、Word、图像、PDF、Epub 等多种格式的文档,许多网站平台的文章、博客、论文均可…

将输入框的数据输出成json

刚学,做一下记录 先上效果图,来不及解释了,后面再说 源码:链接:https://pan.baidu.com/s/1pV8hDVwpB1kresHag7gIew 提取码:**** 操作: 进入项目目录下,cmd 清除npm缓存&#xff1…

Java并发基础:Executor接口和Executors类的区别

Executor是Java中的一个接口,它定义了一种将任务提交与任务执行机制(包括线程管理、调度等)分离的方式,Executors是一个工具类,它提供了多个静态工厂方法,用于创建不同类型的Executor实例。 代码案例 下面…

国家急救日倡议活动暨120急救大课堂公益培训在京成功举办

2024年1月20日,由国家卫生健康委员会等多个相关部门指导,中国医院协会急救中心(站)分会主办,北京急救中心承办的“国家急救日”倡议活动暨急救科普大课堂公益培训系列活动,在全国范围内启动。 健康中国行动…

AI企业知识库:企业智慧之源,引领未来发展

AI企业知识库作为优秘智能的核心技术(shuziren06),具有许多引人注目的功能和特点。接下来让我们深入探讨一下AI企业知识库如何在实际应用中助力企业。以下是对AI企业知识库的更详细介绍: 1. 强大的知识整合能力 AI企业知识库能够…

智慧校园大数据应用系统介绍(2)

OA办公管理系统 教育OA管理系统,是为配合学校内部办公自动化的实施而研发的一套稳定、安全、灵活、实用的办公自动化管理系统。该系统结构精明实用;功能模块灵活稳定;设计人性化、使用简单化且扩展性强。系统由通知,信息采集,工作计划,公文流转、听课反馈、行政护导、资…

ML Design Pattern——I see

ML Life Cycle MLOps ML Pipelines Fully automated processes ML Design Patterns Reading the book? 链接:https://pan.baidu.com/s/1MgOSHASAOJ0EVhMYmT9QeQ?pwd96uk 提取码:96uk

即时按需原子 CSS 引擎:比 Tailwind JIT 快 5 倍! | 开源日报 No.149

unocss/unocss Stars: 14.6k License: MIT 该项目是一个即时的按需原子 CSS 引擎,受到 Windi CSS、Tailwind CSS 和 Twind 的启发,解决了定制化、速度和体积的问题。 以下是该项目的特点和核心优势: 完全可定制:通过预设提供所…

阿里巴巴开源联邦学习框架FederatedScope

5月5日,阿里巴巴达摩院发布新型联邦学习框架FederatedScope,声称可以在不共享训练数据的情况下开发机器学习算法,从而保护隐私。,其源代码现已在Apache 2.0许可下发布在GitHub上。 介绍 该平台被描述为一个全面的联邦学习框架&a…

Day16 linuxC高级(存储类型 linux命令 shell命令)

文章目录 C补充标识常量存储类型1.auto // 自动型2.static:修饰变量和函数 // 静态型3.extern:外部引用4.register:寄存器类型 LinuxC高级简介:嵌入式系统(将软件嵌入到硬件里面)Linux起源查看操作系统版本内核系统架构系统关机或…

阿里云优惠券领取入口、使用方法和限制条件,2024最新

阿里云优惠代金券领取入口,阿里云服务器优惠代金券、域名代金券,在领券中心可以领取当前最新可用的满减代金券,阿里云百科aliyunbaike.com分享阿里云服务器代金券、领券中心、域名代金券领取、代金券查询及使用方法: 阿里云优惠券…

Python Process创建进程(2种方法)详解

虽然使用 os.fork() 方法可以启动多个进程,但这种方式显然不适合 Windows,而 Python 是跨平台的语言,所以 Python 绝不能仅仅局限于 Windows 系统,因此 Python 也提供了其他方式在 Windows 下创建新进程。 Python 在 multiproces…

程序员必备命令之-网络状态命令netstat ss

本文介绍一下两个常用的Linux命令,netstat以及ss,这两个命令均用来查看主机的网络相关的信息。 Netstat netstat 是Unix系统上用于显示各种网络统计信息的命令,目前大多数的Linux系统默认自带该命令。该命令用于显示系统网络连接、路由表等…

JAVA工程中引用本地jar的3种常用方式,你用过哪种?

文章目录 前言1. 第1种方式2. 第2种方式3. 第3种方式 前言 实际项目过程中咱们经常会碰到需要本地引用jar包到java工程中的场景,本文就介绍一下遇到此场景时如何在IDEA中导入本地jar包到工程中的3种方式,简单却很常用。 1. 第1种方式 IDEA -> File …

chrome浏览器Extension插件开发框架对比和介绍

想开发chrome浏览器插件的话,如果没有一个好的框架支持,那么你只能手写js和html实现了,这样做的话,可能效率没有那么高,所以github上就有一些牛人来定制化了这些操作,将react和vue等开发框架快速集成&#…

AtCoder Beginner Contest 221 H. Count Multiset(容斥 dp 拆分数 差分 数形结合)

题目 给定m,n(m<n<5e3)&#xff0c; 求大小为k的多重集合&#xff0c;满足元素和为n&#xff0c; 且每种数在集合中出现的次数都小于等于m的集合数有多少个 答案对998244353取模 思路来源 官方题解 「解题报告」[ABC221H] Count Multiset - K8He - 洛谷博客 Solu…

测试不拘一格——掌握Pytest插件pytest-random-order

在测试领域&#xff0c;测试用例的执行顺序往往是一个重要的考虑因素。Pytest插件 pytest-random-order 提供了一种有趣且灵活的方式&#xff0c;让你的测试用例能够以随机顺序执行。本文将深入介绍 pytest-random-order 插件的基本用法和实际案例&#xff0c;助你摆脱固定的测…

CSGO搬砖项目还能火多久?

最近放假回到老家&#xff0c;见了不少亲戚朋友&#xff0c;大家不约而同都在感叹今年大环境不好&#xff0c;工作不顺&#xff0c;生意效益不好&#xff0c;公司状况不佳&#xff0c;反问我们生意如何&#xff1f;为了让他们心里好受一点&#xff0c;我也假装附和道:也不咋地&…

超简单的OCR模块:cnocr

前言 毫无疑问的是&#xff0c;关于人工智能方向&#xff0c;python真的十分方便和有效。 这里呢&#xff0c;我将介绍python众多OCR模块中一个比较出色的模块&#xff1a;cnocr 模块介绍 cnocr是一个基于PyTorch的开源OCR库&#xff0c;它提供了一系列功能强大的中文OCR模型和…

常用芯片学习——HC245芯片

HC245三态输出八路总线收发器 使用说明 这些八路总线收发器专为数据总线之间的异步双向通信而设计。控制功能实现可更大限度地减少外部时序要求。根据方向控制 (DIR) 输入上的逻辑电平&#xff0c;此类器件将数据从 A 总线发送至 B 总线&#xff0c;或者将数据从 B 总线发送至…