<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Hello, React</title> </head> <body> <!--准备好一个“容器”--> <div id="test"></div> <!--引入react核心库 (有顺序要求) --> <script type="text/javascript" src="../js/react.development.js"></script> <!--全局会有React变量--> <!--引入react-dom,用于支持react操作dom--> <script type="text/javascript" src="../js/react-dom.development.js"></script> <!--全局会有ReactDOM变量--> <!--引入babel,用于将jsx转为js--> <script type="text/javascript" src="../js/babel.min.js"></script> <script type="text/babel"> /* 此处一定要写babel */ // 创建虚拟DOM const VDOM = <h1>Hello, React</h1> /* 此处一定不要加引号,因为不是字符串 */ // 渲染虚拟DOM到页面 ReactDOM.render(VDOM, document.getElementById('test')) </script> </body> </html>