Real DOM和 Virtual DOM 的区别？优缺点？

 

 

 

一、是什么

Real DOM，真实DOM， 意思为文档对象模型，是一个结构化文本的抽象，在页面渲染出的每一个结点都是一个真实DOM结构，如下：

 

 

 

 

Virtual Dom，本质上是以 JavaScript 对象形式存在的对 DOM 的描述

创建虚拟DOM目的就是为了更好将虚拟的节点渲染到页面视图中，虚拟DOM对象的节点与真实DOM的属性一一照应

在React中，JSX是其一大特性，可以让你在JS中通过使用XML的方式去直接声明界面的DOM结构

const vDom = <h1>Hello World</h1> // 创建h1标签，右边千万不能加引号 const root = document.getElementById('root') // 找到<div></div>节点 ReactDOM.render(vDom, root) // 把创建的h1标签渲染到root节点上