当前位置: 首页 > news >正文

《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网页中的标签则被转换成一个个的元素节点。同数据结构中的树形结构一样,这些节点之间也存在父子或兄弟关系。


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

相关文章:

  • 深度学习模型之yolov8实例分割模型TesorRT部署-python版本
  • Dell戴尔XPS 8930笔记本电脑原装Win10系统 恢复出厂预装OEM系统
  • c JPEG 1D DCT 优化1
  • Camera基础原理与畸变补偿
  • Webpack5入门到原理22:提升打包构建速度
  • EtherNet/IP开发:C++开发CIP源代码
  • 9-数组- 除自身以外数组的乘积
  • 开发实战角度:distinct实现原理及具体优化总结
  • 【QT+QGIS跨平台编译】之一:【sqlite+Qt跨平台编译】(一套代码、一套框架,跨平台编译)
  • QMediaPlayer 类的应用--音频播放器
  • 专门为机器学习开发的jpy语言
  • go实现判断20000数据范围内哪些是素数(只能被1和它本身整除的数),采用多协程和管道实现
  • Keil文件路径有中文(用户名)的解决方法
  • Docker(一)简介和基本概念:什么是 Docker?用它会带来什么样的好处?
  • js面试题
  • 【知识碎片】第三方登录弹窗效果
  • eclipse(luna)创建web工程
  • Java 内存分配及垃圾回收机制初探
  • k8s 面向应用开发者的基础命令
  • vue:响应原理
  • vue和cordova项目整合打包,并实现vue调用android的相机的demo
  • 大主子表关联的性能优化方法
  • 干货 | 以太坊Mist负责人教你建立无服务器应用
  • 简单易用的leetcode开发测试工具(npm)
  • 全栈开发——Linux
  • 事件委托的小应用
  • 一、python与pycharm的安装
  • media数据库操作,可以进行增删改查,实现回收站,隐私照片功能 SharedPreferences存储地址:
  • Unity3D - 异步加载游戏场景与异步加载游戏资源进度条 ...
  • ​香农与信息论三大定律
  • #每天一道面试题# 什么是MySQL的回表查询
  • $.proxy和$.extend
  • (52)只出现一次的数字III
  • (Forward) Music Player: From UI Proposal to Code
  • (二)七种元启发算法(DBO、LO、SWO、COA、LSO、KOA、GRO)求解无人机路径规划MATLAB
  • (非本人原创)史记·柴静列传(r4笔记第65天)
  • (附源码)springboot炼糖厂地磅全自动控制系统 毕业设计 341357
  • (原創) 如何安裝Linux版本的Quartus II? (SOC) (Quartus II) (Linux) (RedHat) (VirtualBox)
  • .NET MVC第三章、三种传值方式
  • .net快速开发框架源码分享
  • /etc/shadow字段详解
  • ??javascript里的变量问题
  • @EnableConfigurationProperties注解使用
  • @EventListener注解使用说明
  • @private @protected @public
  • [ 环境搭建篇 ] 安装 java 环境并配置环境变量(附 JDK1.8 安装包)
  • [<事务专题>]
  • [20170705]lsnrctl status LISTENER_SCAN1
  • [BJDCTF2020]The mystery of ip1
  • [BZOJ]4817: [Sdoi2017]树点涂色
  • [CareerCup][Google Interview] 实现一个具有get_min的Queue
  • [EFI]ASUS EX-B365M-V5 Gold G5400 CPU电脑 Hackintosh 黑苹果引导文件
  • [FC][常见Mapper IRQ研究]
  • [GN] DP学习笔记板子
  • [idea]关于idea开发乱码的配置