## **虛擬DOM描述**：
* React 提供了一些 API 來創建一種 “特別” 的一般 js 對象
```JavaScript
var element = React.createElement('h1', {id:'myTitle'},'hello')
```
> 上面創建的就是一個簡單的虛擬 DOM 對象
* 虛擬 DOM 對象最終都會被 React 轉換為真實的 DOM
* 我們編碼時基本只需要操作 react 的虛擬 DOM 相關數據, react 會轉換為真實 DOM 變化而更新界面#
## **真實DOM和虛擬DOM的比較：**
```javascript
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Hello React!</title>
<script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script>
<script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script>
</head>
<body>
<div id="app"></div>
<script>
console.dir(React)
const vDOM=React.createElement('h1',{id:'title',className:'head'},'Hello React')
console.dir(vDOM)
ReactDOM.render(
vDOM,
document.getElementById('app')
);
const DOM=document.getElementById('title')
console.dir(DOM)
</script>
</body>
</html>
```
