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

这篇具有很好参考价值的文章主要介绍了《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 接口标准。

《WebKit 技术内幕》之五(1): HTML解释器和DOM 模型,webkit学习,C/C++,系统内核,webkit,前端,C/C++,内核开发

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

《WebKit 技术内幕》之五(1): HTML解释器和DOM 模型,webkit学习,C/C++,系统内核,webkit,前端,C/C++,内核开发

        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接口。

《WebKit 技术内幕》之五(1): HTML解释器和DOM 模型,webkit学习,C/C++,系统内核,webkit,前端,C/C++,内核开发

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

《WebKit 技术内幕》之五(1): HTML解释器和DOM 模型,webkit学习,C/C++,系统内核,webkit,前端,C/C++,内核开发

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

《WebKit 技术内幕》之五(1): HTML解释器和DOM 模型,webkit学习,C/C++,系统内核,webkit,前端,C/C++,内核开发
       树中存在元素节点和文档节点,其实在规范内部还存在属性节点,但不属于元素节点。在图中没有表现出来。文章来源地址https://www.toymoban.com/news/detail-811620.html

到了这里,关于《WebKit 技术内幕》之五(1): HTML解释器和DOM 模型的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

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

    第五章 HTML 解释器和 DOM 模型 1.DOM 模型 1.1 DOM标准         DOM (Document Object Model)的全称是文档对象模型,它可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构。这里的文档可以是 HTML 文档、XML 文档或者 XHTML 文档。DOM 以面向对象的方式来描述文档,

    2024年01月22日
    浏览(55)
  • 《WebKit 技术内幕》学习之五(3): HTML解释器和DOM 模型

    3 DOM的事件机制         基于 WebKit 的浏览器事件处理过程:首先检测事件发生处的元素有无监听者,如果网页的相关节点注册了事件的监听者则浏览器会将事件派发给 WebKit 内核来处理。另外浏览器可能也需要处理这样的事件(浏览器对于有些事件必须响应从而做出默认

    2024年01月22日
    浏览(40)
  • 《WebKit 技术内幕》学习之五(4): HTML解释器和DOM 模型

    4 影子(Shadow)DOM         影子 DOM 是一个新东西,主要解决了一个文档中可能需要大量交互的多个 DOM 树建立和维护各自的功能边界的问题。 4.1 什么是影子 DOM         当开发这样一个用户界面的控件——这个控件可能由一些 HTML 的标签元素组成,这些元素可以组成一

    2024年01月25日
    浏览(41)
  • 《WebKit 技术内幕》之六(3): CSS解释器和样式布局

    3.1 基础         当WebKit创建RenderObject对象之后,每个对象是不知道自己的位置、大小等信息的,WebKit根据框模型来计算它们的位置、大小等信息的过程称为布局计算(或者称为排版)。         图描述了这一过程中涉及的主要WebKit类。第5章描述过Frame类,用于表示网

    2024年01月22日
    浏览(45)
  • 《WebKit 技术内幕》之六(1): CSS解释器和样式布局

    《WebKit 技术内幕》之六(1):CSS解释器和样式布局         CSS解释器和规则匹配处于DOM树建立之后,RenderObject树之前,CSS解释器解释后的结果会保存起来,然后RenderObject树基于该结果来进行规范匹配和布局计算。当网页有用户交互或者动画等动作的时候,通过CSSOM等技术

    2024年01月22日
    浏览(40)
  • 《WebKit 技术内幕》之二: HTML 网页和结构

    第二章 HTML 网页和结构        HTML网页是利用HTML语言编写的文档,HTML是半结构化的数据表现方式,它的结构特征可以归纳为:树状结构、层次结构和框结构。 1.网页构成 1.1 基本元素和树状结构         HTML网页使用HTML语言撰写的文档,发展到今天基本上都是动态网页(

    2024年01月19日
    浏览(35)
  • 『pycharm 』解决无法添加解释器,无法新建项目问题(是无法添加解释器,不是没有添加解释器)

    这个问题和大家常见的: 没有Python解释器 这种简单问题不同。请看问题描述。👇👇 如图,解释器列表空空如也,即使点击“ 添加本地解释器 ”也没有反应(那个展开小三角也是空的)。 所有项目都这样了,那里变成空的了。而且这些都是我自己的项目,之前都好好的。 删

    2024年02月11日
    浏览(75)
  • Pycharm 重命名SSH的conda解释器后,提示该解释器不可用

    目前已知是BUG,截至投稿日未修复 已经提交给youtrack.jetbrains.com,如下图:

    2024年01月17日
    浏览(77)
  • 解锁Spring Boot中的设计模式—02.解释器模式:探索【解释器模式】的奥秘与应用实践!

    解释器模式(Interpreter Pattern)是一种行为设计模式,它用于定义语言的文法,并且解释语言中的表达式。在Java中,解释器模式可以用于构建解释器以解析特定的语言或表达式,如数学表达式、查询语言等。 优点: 灵活性: 解释器模式可以 灵活地添加新的表达式和规则 ,因

    2024年02月19日
    浏览(72)
  • 解释器模式(Interpreter)

    解释器模式是一种行为设计模式,可以解释语言的语法或表达式。给定一个语言,定义它的文法的一种表示,然后定义一个解释器,使用该文法来解释语言中的句子。解释器模式提供了评估语言的语法或表达式的方式。 解释器模式包含如下角色: Context,上下文,包含解释器

    2024年02月14日
    浏览(45)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包