react學習筆記–jsx和原始方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="test1"></div>
<div id="text2"></div>
</body>
<script type="text/javascript" src="../js/react.development.js"></script>
<script type="text/javascript" src="../js/react-dom.development.js"></script>
<script type="text/javascript" src="../js/babel.min.js"></script>
<script type="text/javascript">
const myContent = "I Love You";
const myId = "Atguigu";
const vDom = React.createElement('h2',{id:myId.toLowerCase()},myContent.toUpperCase());
ReactDOM.render(vDom,document.getElementById('test1'));
</script>
<script type="text/babel">
ReactDOM.render(
<h2 id={myId.toUpperCase()}> {myContent.toLowerCase()}</h2>,document.getElementById('text2')
)
</script>
</html>
由上面語法可以看出來，jsx語法更爲簡潔，推薦使用。