React试图

这里因为没有js代码 用的官方的

<script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script>
    <!--    相当于react.js  -->
    <script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script>
    <!--    相当于react-dom.js  -->

<div id="root"></div>
    <script>
        /*
                                                                                        React.js   提供  核心代码
                                                                                        ReactDOM   提供了与流浪其交互的DOM更能  ，  如虚拟DOM
                                                                                        */
        //在外面添加
        let h1 = React.createElement("h1", null, "我是一个标题")
        let h2 = React.createElement("h2", null, "我是一个哈哈哈")
        let el = React.createElement(
            "header", {
                id: "header"
            },
            h1,
            h2
        );
        //渲染
        ReactDOM.render(
            el,
            // h1,
            // p,
            // React.createElement(),  //添加标签和内容   这是在里面添加
            document.querySelector("#root"),
            () => {
                console.log("渲染成功")
            }
        )
    </script>

React JSX代码

 <script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.js"></script>
    <!--    相当于JSX  -->

 <div id="root"></div>

    <script type="text/babel">
        /* JSX : jacaScript 如XML的拓展语法 */ ReactDOM.render(
        < header>
            < h1> hello react
                < /h1>
                    < p> l里用Jsx来渲染
                        < /p>
                            < / header> , document.querySelector("#root"), () => { console.log("渲染成功") } )
    </script>