使用React对象生成虚拟DOM

1、引入文件

<!-- 引入react的核心库-->
<script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
<!-- 引入react的Dom操作库核心库-->
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/babel-standalone/7.19.5/babel.js"></script>

2、引入react核心库文件之后，会多一个react对象。该对象上有一个createElement方法，可通过该方法创建虚拟dom。

let dom1 = React.createElement("h1", { id: "app" }, "hello world!");

备注：其中第一个属性传递标签名称，第二个属性传递一个对象，当做标签的属性，第三个值是标签的内容。

3、渲染dom

ReactDOM.render(dom1, document.getElementById("test1"));