首先，element是react中最基本的元素，它表示了你在屏幕上所看到的一个视图元素。element是这样定义的：
const element = <h1>Hello, world</h1>
和浏览器的dom元素不同的是，react的element是纯文本的对象，并且很容易创建。react根据element来更新实际的dom。
注意：
有人可能会将element和component混为一谈，后者是一个被大家熟知的概念，因为react宣称自己是面向组件化开发，而component正是组件的意思。实际上，element是component的组成元素。
将element渲染进dom树里
在你的html文件里会有这么一行代码：
<div id="root"></div>
我们将其称为根dom节点，因为在插入这个div之中的所有东西都会被react所控制。
用react创建的应用通常只有一个根dom节点。如果你需要将react的应用合并到已有的应用中，你只需要将root节点独立出来即可。
渲染element到dom中需要调用ReactDOM.render()函数：
const element = <h1>Hello, world</h1>;
ReactDOM.render(
element,
document.getElementById('root')
);
上面的代码在页面中渲染了“Hello，world”。
更新被渲染的element
element是一但被渲染是不能被改变的。一旦你创建了一个element，你不能改变它的属性值和孩子元素。一个element像是一个单独的模块：它在某点处实时的渲染了UI。
就我们现有的知识而言，更新一个element的唯一办法是创建一个新的element并且执行ReactDOM.render()渲染它：
function tick() {
const element = (
<div>
<h1>Hello, world!</h1>
<h2>It is {new Date().toLocaleTimeString()}.</h2>
</div>
);
ReactDOM.render(
element,
document.getElementById('root')
);
}
setInterval(tick, 1000);
注意：
在实际项目中，大多React的应用只会调用一次ReactDOM.render()。在下一章节，我们将会学到上面这样的代码怎样封装在状态组件中。
React仅仅更新需要更新的地方
React会将element和他的子元素同之前的进行比较，将发生改变的部分更新到实际的DOM树上。
