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

news2025/1/14 18:06:48

第五章 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/1401244.html

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

相关文章

ubuntu 相关内容

ubuntu 优盘安装: 台式机安装纯ubuntu系统的操作步骤-CSDN博客https://blog.csdn.net/youngwah292/article/details/127032009?ops_request_misc%257B%2522request%255Fid%2522%253A%2522170583039216800213099577%2522%252C%2522scm%2522%253A%252220140713.1301…

音视频开发ffmpeg

ffmpeg数据结构 重要的结构体 压缩数据 avpacket 帧数据 avframe 管家: avformatcontext 格式上下文 文件是一种协议 解协议(http、rtsp rtmp mms tcp udp…) AVIOContext URLProtocol URLContext存储音视频中的协议类型和状态 有缓冲区…

74.搜索二维矩阵 - 力扣(LeetCode)

题目描述 给你一个满足下述两条属性的 m x n 整数矩阵: 每行中的整数从左到右按非严格递增顺序排列。 每行的第一个整数大于前一行的最后一个整数。 给你一个整数 target ,如果 target 在矩阵中,返回 true ;否则,返回…

爬虫案例—雪球网行情中心板块数据抓取

爬虫案例—雪球网行情中心板块数据抓取 雪球网行情中心网址:https://xueqiu.com/hq 目标:市场一览板块、热股榜板块、新股预告板块、关注排行榜板块 import datetimeimport requestsheaders {user-agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10…

算法优化:LeetCode第122场双周赛解题策略与技巧

接下来会以刷常规题为主 &#xff0c;周赛的难题想要独立做出来还是有一定难度的&#xff0c;需要消耗大量时间 比赛地址 3011. 判断一个数组是否可以变为有序 public class Solution {public int minimumCost(int[] nums) {if (nums.length < 3) {// 数组长度小于3时&a…

即插即用篇 | AKConv:具有任意采样形状和任意参数数量的卷积核

基于卷积操作的神经网络在深度学习领域取得了显著的成果,但标准卷积操作存在两个固有缺陷。一方面,卷积操作受限于局部窗口,无法捕捉其他位置的信息,而其采样形状是固定的。另一方面,卷积核的大小固定为kk,呈固定的正方形形状,而参数数量往往随大小呈平方增长。显然,不…

章鱼网络 Community Call #17|打造全新 Omnity 跨链协议

香港时间2024年1月8日12点&#xff0c;章鱼网络举行第17期 Community Call。 对于 Octopus Community 而言&#xff0c;2023年是一个分水岭。我们如期兑现我们的承诺&#xff0c;成功上线了包括 $NEAR Restaking 和 Adaptive IBC 在内的完整的 Octopus 2.0。 自从我们在2023年…

编曲学习:Cubase12导入Cubasis工程的方法!

Steinberg 发布 Cubasis 3 项目导入器&#xff0c;可将 Cubasis 的项目导入到 Cubase 使用https://m.midifan.com/news_body.php?id35635 我偶然看到这个文章&#xff0c;不过发现Cubase12默认好像没有这个选项&#xff0c;心想着要是移动端能和PC端同步&#xff0c;感觉会挺…

腾讯云服务器价格查询,2024更新

腾讯云服务器租用优惠价格表&#xff1a;轻量应用服务器2核2G3M价格62元一年、2核2G4M价格118元一年&#xff0c;540元三年、2核4G5M带宽218元一年&#xff0c;2核4G5M带宽756元三年、轻量4核8G12M服务器646元15个月&#xff1b;云服务器CVM S5实例2核2G配置280.8元一年、2核4G…

力扣509. 斐波那契数

动态规划 思路&#xff1a; 斐波那契数通式&#xff1a;F(n) F(n - 1) F(n - 2)&#xff1b;以此为状态转移方程&#xff0c;对其进行动态规划&#xff1b;边界条件&#xff1a; F(0) 0F(1) 1使用两个变量来存储上一组结果&#xff1b; class Solution { public:int fib(…

触摸屏监控双速电动机-PLC I/O电路设计

PLC的输入接线电路图 PLC的输入接线电路如图1-21所示。24VDC电源选用0.7mm2的棕色和蓝色软铜导线&#xff0c;弱电信号线用0.5~0.7mm2的黑色或者白色软铜导线。 PLC输入接线图 PLC的输出接线电路图 PLC的输出接线电路如图1-22所示。AC220V接触器型号为CJX2-12&#xff0c;线…

Kubernetes实战(十八)-Pod配置污点和容忍

1 污点 1.1 污点简介 亲和性调度的方式都是站在Pod的角度上&#xff0c;通过在Pod上增加属性来将Pod调度到到指定的节点上&#xff0c;其实也可以站在Node节点的角度上&#xff0c;通过给Node节点设置属性&#xff0c;来决定是否允许Pod调度过来&#xff0c;这就是污点。 No…

数据结构代码实现 —— 单链表【Java】

单链表的概述及性质等在篇不做赘述&#xff0c;有需要可移步以下文章&#xff1a; 《数据结构 C语言版 严蔚敏 第2版》&#xff1a;线性表https://blog.csdn.net/weixin_43551213/article/details/134048025 以下仅展示使用 Java 实现单链表 结点结构定义&#xff1a; publ…

国外邮箱服务:功能、作用与价格全面解析

不同于我们熟悉的国内邮箱服务&#xff08;如163、QQ邮箱等&#xff09;&#xff0c;国外邮箱通常指的是海外提供商所提供的电子邮件服务&#xff0c;如谷歌的Gmail、微软的Outlook、雅虎的Yahoo Mail等&#xff0c;当然也有特殊的比如Zoho Mail邮箱&#xff0c;国内外双版本&a…

Docker(四)操作容器

作者主页&#xff1a; 正函数的个人主页 文章收录专栏&#xff1a; Docker 欢迎大家点赞 &#x1f44d; 收藏 ⭐ 加关注哦&#xff01; 操作 Docker 容器 容器是 Docker 又一核心概念。 简单的说&#xff0c;容器是独立运行的一个或一组应用&#xff0c;以及它们的运行态环境…

算法专题[递归-搜索-回溯-2-DFS]

算法专题[递归-搜索-回溯-2-DFS] 一.计算布尔二叉树的值&#xff1a;1.思路一&#xff1a;2.GIF题目解析 二.求根节点到叶子节点的数字之和1.思路一&#xff1a;2.GIF题目解析 三.二叉树剪枝1.思路一&#xff1a;2.GIF题目解析 四.验证二叉搜索树1.思路一&#xff1a;2.GIF题目…

C++学习笔记——指针

1&#xff0c;指针的基本概念 指针的作用&#xff1a;可以通过指针间接访问内存 内存的编号是从0开始记录的&#xff0c;一般用十六进制数字表示可以利用指针变量保存地址 上图中的p就是a变量的指针&#xff0c;也可以记作*a 2&#xff0c;指针变量的定义和使用 指针变量定…

AI大模型开发架构设计(3)——如何打造自己的大模型

文章目录 如何打造自己的大模型1 新时代职场人应用AIGC的5重境界2 人人需要掌握的大模型原理职场人都能听懂的大语音模型的训练过程职场人都能听得懂的大语言模型的Transformer推理过程 3 如何构建自己的大模型需要具备三个方面的能力LangChain是什么&#xff1f;LangChain主要…

【精选】中间件 tomcat漏洞复现

&#x1f36c; 博主介绍&#x1f468;‍&#x1f393; 博主介绍&#xff1a;大家好&#xff0c;我是 hacker-routing &#xff0c;很高兴认识大家~ ✨主攻领域&#xff1a;【渗透领域】【应急响应】 【python】 【VulnHub靶场复现】【面试分析】 &#x1f389;点赞➕评论➕收藏…

在腾讯云买了云服务器和域名如何快速建网站?

使用腾讯云服务器搭建网站全流程&#xff0c;包括轻量应用服务器和云服务器CVM建站教程&#xff0c;轻量可以使用应用镜像一键建站&#xff0c;云服务器CVM可以通过安装宝塔面板的方式来搭建网站&#xff0c;腾讯云服务器网txyfwq.com分享使用腾讯云服务器建站教程&#xff0c;…