React（一）：React元素渲染以及ReactDOM.render()方法

一、React的元素

1.React中元素是什么？

我的理解是元素是组成React应用的一个个的组成部分，是React中的基本单位，是一个用来描述DOM节点或React组件的普通JavaScript对象。

2.React中元素的特点

元素是不可变的，一旦创建就不能对它的属性或者内容进行修改

3.React中元素的定义

这是一个React中元素定义的示例：

const element = <h1>Hello React</h1>

二、ReactDOM.render()方法

ReactDOM.render()方法是React库中的一个重要方法，用于将React元素渲染到DOM中。它的语法如下：

ReactDOM.render(element, container, callback)

其中，element参数是要渲染的React元素对象，container参数是渲染元素的容器DOM节点，callback参数是一个可选的回调函数，在渲染完成后执行。

下面是一个使用的示例：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>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>
    <script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.js"></script>
</head>
<body>
    <!-- 根节点 -->
    <div id="example"></div>

    <script type="text/babel">
        //元素
        const element = <h1>Hello React</h1>
        
        ReactDOM.render(
            element,
            document.getElementById('example')
        );
    </script>
</body>
</html>