<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
//依赖项
<script src="../node_modules/react/umd/react.development.js"></script>
<script src="../node_modules/react-dom/umd/react-dom.development.js"></script>
<script src="../node_modules/babel-standalone/babel.js"></script>
</head>
<body>
<div id="app">
</div>
<script type="text/babel"> //jsx语法
let a = 100;
ReactDOM.render(
<h1 className='tit' style={{color:'red',fontSize:a+'px'}}>123</h1>,
// 类名书写方式 内联样式 用{{}} 双括号 可以写变量
// React.createElement('div',{style:{color:'red'}},'123'), 相当于render方法
//render(第一个参数是dom元素，第二个参数是样式，第三个参数显示的内容)
document.getElementById('app')
)
</script>
</body>
</html>
//模板解析语法是{} 大括号一对