1. 三、解析和DOM树的构建
  2.   1、解析：
  3.   由于解析渲染引擎是一个非常重要的过程，我们将会一步步的深入，现在让我们来介绍解析。
  4.   解析一个文档，意味着把它转换为一个有意义的结构——代码可以了解和使用的东西，解析 的结果通常是一个树的节点集合，用来表示文档结构，它被称为解析树或者语法树。
  5.   例子：
  6.   解析表达式“2+3-1”，返回树如下图3.1
  7.  
  8.     1)、语法：
  9.     解析是基于文档所遵循的语法规则——书写所用的语言或格式——来进行的。每一种可以解析的格式必须由确定的语法与词汇组成。这被称之为上下文无关语法。 人类语言并非此种语言，所以不能用常规的解析技术来解析。
  10.  
  11.     2)、解析器——分析器组合：
  12.     解析器有两个处理过程——词法分析与语法分析。
  13.     词法分析负责把输入切分成符号序列，符号是语言的词汇——由该语言所有合法的单词组成。语法分析是对该语言语法法则的应用。
  14.     解析器通常把工作分给两个组件——词法分析程序（有时被叫分词器）负责把输入切分成合法符号序列，解析器负责按照语法规则分析文档结构和构建语法树。
  15.     词法分析程序知道如何过滤像空格，换行之类的无关字符。如下图3.1.2
  16.  
  17.     解析过程是迭代的。解析器通常会从词法分析器获取新符号并尝试匹配句法规则。如果匹配成功，就在句法树上创建相应的节点，并继续从词法分析器获取下一个符号。
  18.     如果没有匹配的规则，解析器会内部保存这个符号，并继续从词法分析器获取符号，直到内部保存的所有符号能够成功匹配一个规则。
  19.     如果最终无法匹配，解析器会抛出异常。这意味着文档无效，含有句法错误。
  20.  
  21.     3)、转换：
  22.     多数情况下，解析树并非是最终结果，解析经常被用于转换——输入文档转换为另一种格式，比如一个编译器要把源码编译成机器码，首先会解析成解析树，然后再转换成机器码，如下图3.1.3
  23.  
  24.     4)、解析示例：
  25.     在图3.1中，我们构建了一个数学表达式解析树，让我们来试着定义一个简单的数学语言并看看解析是如何进行的。
  26.     词汇：我们的语言可以包含整数、加号和减号。
  27.     语法：
  28.       1>.语法由表达式、术语和操作符组成
  29.       2>.我们的语言能包含任何数字类型的表达式
  30.       3>.表达式定义为术语紧跟着操作符，再跟另外一个术语。
  31.       4>.操作符为一个加号和一个减号
  32.       5>.术语是一个整数或者表达式
  33.     现在让我们来分析输入“2+3-1”：
  34.     第一个符合规则的子字符串是”2″，根据规则#5它是一个术语。第二个匹配是”2 + 3″，符合第二条规则——一个术语紧跟一个操作符再跟另外一个术语。下一个匹配出现在输入结束时。”2 + 3 – 1″是一个表达式，因为我们已知“2+3”是一个术语，所以符合第二条规则。 “2 + + “不会匹配任何规则，所以是无效的输入。
  35.  
  36.     5)、词法与句法的合法性定义：
  37.     词汇通常用正则表达式来表示。
  38.     比如我们的语言可以定义为:
  39.     INTEGER :0|[1-9][0-9]*
  40.     PLUS : +
  41.     MINUS: -
  42.     如你所见，整型是由正则表达式定义的。
  43.     句法常用BNF格式定义，我们的语言被定义为：
  44.     expression :=  term  operation  term
  45.     operation :=  PLUS | MINUS
  46.     term := INTEGER | expression
  47.     我们说过常规解析器只能解析上下文无关语法的语言。这种语言的一个直觉的定义是它的句法可以用BNF完整的表达。其规范定义请参考 http://en.wikipedia.org/wiki/Context-free_grammar
  48.  
  49.     6)、解析器的类型：
  50.     解析器有两种基本类型——自上而下解析器和自下而上解析器。主观上可以认为自上而下的解析器从上层句法结构开始尝试匹配句法；自下而上的则从输入开始，慢慢转换成句法规则，从底层规则开始，直到上层规则全部匹配。
  51.     让我们看看这两种解析器将怎样解析我们的例子：
  52.     自上而下解析器从上层规则开始，它会把”2 + 3″定义为表达式，然后定义”2 + 3 – 1″为表达式(定义表达式的过程中也会匹配其它规则，但起点是最高级别规则)。
  53.     自下而上的解析器会扫描输入，直到有匹配的规则，它会把输入替换成规则。这样一直到输入结束。部分匹配的规则会放入解析堆栈。如下图：3.1.6
  54.  
  55.     这种自下而上的解析器叫作移位归约解析器，因为输入被向右移动(想象一下一个指针从指向输入开始逐渐向右移动) 并逐渐归约到句法树。
  56.  
  57.     7)自动创建解析器
  58.     有一些工具可以为你创建解析器，它们通常称为解析器生成器。你只需要提供语法——词汇与句法规则——它就能生成一个可以工作的解析器。创建解析器需要对解析器有深入的了解，并且手动创建一个优化的解析器并不容易，所以解析器生成工具很有用。
  59.     Webkit使用两款知名的解析器生成工具：Flex用于创建词法分析器，Bison用于创建解析器 (你也许会看到它们以Lex和Yacc的名字存在)。Flex的输入文件是符号的正则表达式定义，Bison的输入文件是BNF格式的句法定义。
  60.  
  61.   2.HTML解析器：
  62.   HTML解析器的工作是解析HTML标记到解析树
  63.     1)HTML语法定义
  64.     HTML的词汇与句法定义在w3c组织创建的规范中。当前版本是HTML4，HTML5的工作正在进行中。
  65.     2)不是上下文无关语法
  66.     在对解析器的介绍中看到，语法可以用类似BNF的格式规范地定义。不幸的是所有常规解析器的讨论都不适用于HTML（我提及它们并不是为了娱乐，它们可以用于解析CSS和JavaScript）。HTML无法用解析器所需的上下文无关的语法来定义。过去HTML格式规范由DTD (Document Type Definition)来定义，但它不是一个上下文无关语法。
  67.     HTML与XML相当接近。XML有许多可用的解析器。HTML还有一个XML变种叫XHTML，那么它们主要区别在哪里呢？区别在于HTML应用更加”宽容”，它容许你漏掉一些开始或结束标签等。它整个是一个“软”句法，不像XML那样严格死板。 总的来说这一看似细微的差别造成了两个不同的世界。一方面这使得HTML很流行，因为它包容你的错误，使网页作者的生活变得轻松。另一方面，它使编写语法格式变得困难。所以综合来说，HTML解析并不简单，现成的上下文相关解析器搞不定，ＸＭＬ解析器也不行。
  68.     3)HTML DTD
  69.     HTML的定义使用DTD文件。这种格式用来定义SGML族语言，它包含对所有允许的元素的定义，包括它们的属性和层级关系。如我们前面所说，HTML DTD构不成上下文无关语法。
  70.     DTD有几种不同类型。严格模式完全尊守规范，但其它模式为了向前兼容可能包含对早期浏览器所用标签的支持。当前的严格模式ＤＴＤ：http://www.w3.org/TR/html4/strict.dtd
  71.     4)DOM
  72.     解析器输出的树是由DOM元素和属性节点组成的。DOM的全称为：Document Object Model。它是HTML文档的对象化描述，也是HTML元素与外界（如Javascript）的接口。
  73.     DOM与标签有着几乎一一对应的关系，如下：
  74.     <html>
  75.       <body>
  76.         <p>hello world</p>
  77.         <div><img src="aa.png"/></div>
  78.       </body>
  79.     </html>
  80.     其对应的DOM树如下3.2.4图：
  81.  

  82.     与HTML一样，DOM规范也由w3c组织制订。参考：http://www.w3.org/DOM/DOMTR. 这是一个操作文档的通用规范。有一个专门的模块定义HTML特有元素: http://www.w3.org/TR/2003/REC-DOM-Level-2-HTML-20030109/idl-definitions.html.
  83.     当我们说树中包含DOM节点时，意思就是这个树是由实现了DOM接口的元素组成。这些实现包含了其它一些浏览器内部所需的属性。

dom树的介绍，及原理分析的更多相关文章

  1. 转载：AbstractQueuedSynchronizer的介绍和原理分析

    简介 提供了一个基于FIFO队列,可以用于构建锁或者其他相关同步装置的基础框架.该同步器(以下简称同步器)利用了一个int来表示状态,期望它能够成为实现大部分同步需求的基础.使用的方法是继承,子类通过 ...

  2. AbstractQueuedSynchronizer的介绍和原理分析（转）

    简介 提供了一个基于FIFO队列,可以用于构建锁或者其他相关同步装置的基础框架.该同步器(以下简称同步器)利用了一个int来表示状态,期望它能够成为实现大部分同步需求的基础.使用的方法是继承,子类通过 ...

  3. Servlet过滤器介绍之原理分析

    zhangjunhd 的BLOG     写留言去学院学习发消息 加友情链接进家园 加好友 博客统计信息 51CTO博客之星 用户名:zhangjunhd 文章数:110 评论数:858 访问量:19 ...

  4. Hadoop数据管理介绍及原理分析

    Hadoop数据管理介绍及原理分析 最近2014大数据会议正如火如荼的进行着,Hadoop之父Doug Cutting也被邀参加,我有幸听了他的演讲并获得亲笔签名书一本,发现他竟然是左手写字,当然这个 ...

  5. AbstractQueuedSynchronizer的介绍和原理分析

    简介 提供了一个基于FIFO队列,可以用于构建锁或者其他相关同步装置的基础框架.该同步器(以下简称同步器)利用了一个int来表示状态,期望它能够成为实现大部分同步需求的基础.使用的方法是继承,子类通过 ...

  6. 转：AbstractQueuedSynchronizer的介绍和原理分析

    引自:http://ifeve.com/introduce-abstractqueuedsynchronizer/ 简介 提供了一个基于FIFO队列,可以用于构建锁或者其他相关同步装置的基础框架.该同 ...

  7. ConcrrentSkipListMap介绍和原理分析

    一.前言: JDK为我们提供了很多Map接口的实现,使得我们可以方便地处理Key-Value的数据结构. 当我们希望快速存取<Key, Value>键值对时我们可以使用HashMap. 当 ...

  8. TKmybatis的框架介绍和原理分析及Mybatis新特性

    tkmybatis是在mybatis框架的基础上提供了很多工具,让开发更加高效,下面来看看这个框架的基本使用,后面会对相关源码进行分析,感兴趣的同学可以看一下,挺不错的一个工具 实现对员工表的增删改查 ...

  9. TKmybatis的框架介绍和原理分析及Mybatis新特性演示

    tkmybatis是在mybatis框架的基础上提供了很多工具,让开发更加高效,下面来看看这个框架的基本使用,后面会对相关源码进行分析,感兴趣的同学可以看一下,挺不错的一个工具 实现对员工表的增删改查 ...

随机推荐

  1. javaScript中的原型

    最近在学习javaScript,学习到js面向对象中的原型时,感悟颇多.若有不对的地方,希望可以指正. js作为一门面向对象的语言,自然也拥有了继承这一概念,但js中没有类的概念,也就没有了类似于ja ...

  2. javaScript入门1--组成，基本使用

    javaScript:脚本语言,最初是为了实现在客户端进行的表单验证以减少服务器的数据交互次数,如今可用在页面交互,计算,拥有了闭包,匿名(拉姆达)函数,甚至元编程等特性. javaScript实现的 ...

  3. 使用 Feedly RSS阅读器订阅技术大牛的博客

    这几天一直都在自己看书,可是书上面的东西都比较落后一点,而且没有大牛博文上的东西讲的深入,可是来回跳转各位大牛的博客又非常的麻烦,有一些公众账号虽然也会推荐一些知识内容,可是你应该有过看到多个公众号发 ...

  4. 【Nginx 1】Nginx 的下载和安装

    今天正式开始学习Nginx.Nginx是一个著名的轻量级Http服务器,目前已经有很多知名网站使用Nginx作为服务器.因为Nginx是开源的软件,因此对于开发人员和学习者来说都是一个大宝藏. 首先, ...

  5. 如何删除C/C++源代码中的注释

    具体代码: #include <stdlib.h>  #include <stdio.h>  //删除注释  void commentFilter(FILE* sourceFi ...

  6. linux云计算集群架构学习笔记:rhel7基本命令操作

     1-3-RHEL7基本命令操作 1.1Linux终端介绍 Shell提示符 Bash Shell基本语法. 1.2基本命令的使用:ls.pwd.cd. 1.3查看系统和BIOS硬件时间. 1.4 L ...

  7. Linux系统root用户忘记密码解决方法

    一:在linux系统启动时(如下图),按e键 二:进入到设置页面,定位到如下行: 三:按e键,进入输入界面 四:在编辑行最后面,空格,输入single,回车后回到第二步界面,只是后面多了single ...

  8. [Yii2]Access to debugger is denied due to IP address restriction. The requesting IP address is

    在更新到正式平台,看到runtime/app.log 有 Access to debugger is denied due to IP address restriction. The request ...

  9. C#.net拖拽实现获得文件路径

    思路: 通过DragEnter事件获得被拖入窗口的“信息”(可以是若干文件,一些文字等等),  在DragDrop事件中对“信息”进行解析.        窗体的AllowDrop属性必须设置成tru ...

  10. 将svn添加到系统服务

    C:\Users\Administrator>sc create svnServer binPath= "D:\Program Files\Subversion\bin\svnserv ...