虚拟DOM的解决方式是，通过状态生产一个虚拟状态Dom,然后根据虚拟节点进行渲染，假如是首次渲染的就会直接渲染，但是二次往后的话就是进行虚拟状态树的对比，只更新不同的地方。
2. 换成AST的是Vue模板，Vue需要根据模版去处理各种插值、指令；
生成虚拟DOM的是最终要展示在页面上的内容的对象描述，Vue每次需要通过Diff算法对比新旧虚拟DOM的差异；
固定模版生成的AST是不变的，虚拟DOM是不断变化、需要进行差异对比的（数据等会变）。
template -->抽象语法树 -->render(h) -->虚拟DOM-->UI
3. 抽象语法树的终点是渲染函数（h函数）。
渲染函数（h函数）,它既是AST的产物，也是vnode(虚拟节点)的起源。h函数里面是不含指令的。
抽象语法树不会进行diff算法的并且抽象语法树不会直接生成虚拟节点，抽象语法树最终生成的是渲染函数的
参考 https://zhuanlan.zhihu.com/p/111715881
DOM 的全称是" Document Object Model "，中文意思为“文档对象模型”。
就像 JS 中所有的对象都继承自 Object 一样，浏览器提供一个原生的节点对象 Node （Node 是一个函数）， DOM 的所有节点都继承自 Node ，Node 又继承自 Object，因此它们具有一些共同的属性和方法。
一个文档的所有节点，按照所在的层级，可以抽象成一种树状结构。这种树状结构就是 DOM 树。
顶层的 根节点 html 属于 Document 节点，代表整个文档；
第二层级和第三层级的属于 Element 节点，即网页的各种 HTML 标签；
第四层级的属于 Text 节点，即标签之间或标签包含的文本。
页面中的节点，通过上述不同的构造函数，构造出相应的对象。
由此可以看出 DOM 的主要作用 ：DOM 是 JavaScript 操作网页的接口，它的作用是将网页转为一个 JavaScript 对象，从而可以用脚本进行各种操作（如增删改查）。
DOM 有自己的国际标准，目前通用版本是 DOM 3。
Node 属性有很多，用到时可以查询文档。
如果一个属性是函数，那么这个属性也叫做 方法 ；即方法是函数属性。
document对象是文档的根节点，window.document属性就指向这个对象。
通过 DOM API 获取到的 elements 都是伪数组。
Element 对象对应网页的 HTML 元素。每一个 HTML 元素在 DOM 树上都会转化成一个 Element 节点对象。
DOM 提供两种节点集合，用于容纳多个节点： NodeList 和 HTMLCollection 。这两种集合都属于接口规范。许多 DOM 属性和方法，返回的结果是 NodeList 实例或 HTMLCollection 实例。
节点对象除了继承 Node 接口以外，还会继承其他接口。
加载html文件时，把此文件的<body>..</body>的全部源代码传到一个function中进行处理，或替换，或屏蔽，这个具体的处理视LZ的要求而定！大概如下： 1、某html文件： $(function(){ var bodyString = replaceFunctioin($("body").html()) $("body").html(bodyString) }) 2、某replaceFunction方法： function replaceFunction(str){ var result = str.replace("中文","Chinese") result += result.replace("英文","English") //... return result }作用：把html中的“中文”和“英文”用英语替换！！！
