介绍JSX为何能让浏览器识别，渲染DOM和页面。
先看下JSX代码：
在组件的render函数中返回了html结构代码。
浏览器渲染结果：
真相是什么？
babel的功劳。babel把JSX代码通过React.createElement(type, config={}, children=[])调用，见到一个DOM元素，创建一个，且互相之间通过children关联，最终形成了一个虚拟DOM树，并以对象形式返回。
具体怎么转换，可以在babel官网中查看。babeljs.io/ -》try it out ->选择react-》左侧贴入JSX代码-》查看右侧babel处理后的代码-》将babel处理后代码粘贴到render函数中，发现不指定<script type="text/babel">也能正常渲染页面。
createElement（type, config, children）用法
- type: 字符串，指定元素标签
<div> => 'div' - config:标签上的属性attribute,
<div className="header" key="index"> => {class: header, key: index} - children:嵌套子元素，可以是自己的文本，也可以是子DOM，子DOM则再调用react.createElement()
其他补充图片：
