<body>
<!-- React 真實 DOM 將會插入到這里 -->
<div id="example"></div>
<!-- 引入 React -->
<script src="src/libs/react.js"></script>
<!-- 引入 JSX 語法格式轉換器 -->
<script src="src/libs/JSXTransformer.js"></script>
<script src="src/libs/jquery.js"></script>
<!-- 注意：script 需要注明 type 為 text/jsx 以指定這是一個 JSX 語法格式 -->
<script type="text/jsx">
var arr = ['籃球','足球','乒乓球'];
React.render(
<div>
{
arr.map(function(name){
return <div>{name}</div>
})
}
</div>,
document.getElementById("example")
)
</script>
</body>
<body>
<!-- React 真實 DOM 將會插入到這里 -->
<div id="example"></div>
<!-- 引入 React -->
<script src="src/libs/react.js"></script>
<!-- 引入 JSX 語法格式轉換器 -->
<script src="src/libs/JSXTransformer.js"></script>
<script src="src/libs/jquery.js"></script>
<!-- 注意：script 需要注明 type 為 text/jsx 以指定這是一個 JSX 語法格式 -->
<script type="text/jsx">
var arr = ['籃球','足球','乒乓球'];
React.render(
<div>
{arr}
</div>,
document.getElementById("example")
)
</script>
</body>
上面代碼的arr變量是一個數組，結果JSX會把它的所有成員，添加到模板