JSX：
1.全称：JavaScriptXML，
2.react定义的一种类似于XML的JS扩展语法：XML+JS
3.作用：用来创建react虚拟DOM（元素）对象
var ele=<h1>Hello,world!</h1>
注意：他不是一个字符串，也不是HTML/XML，它最终产生的就是一个JS对象
4.标签名/属性任意：HTML标签/属性或者其他标签/属性
5.基本语法规则：
遇到 < 开头的代码 以标签语法解析
遇到 { 开头的代码 以JS语法解析；标签中的JS必须用{}包裹起来
6.babel.js的作用
浏览器不能直接解析JSX代码，需要babel转译为JS代码才能运行；
在使用JSX代码之前加type=“text/babel”声明
将数据数组转化为标签数组：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>work2</title>
<script src="../js/react.development.js"></script>
<script src="../js/react-dom.development.js"></script>
<script src="../js/babel.min.js"></script>
<script type="text/babel">
const names = ['jquery','angular','aepto','react','vue'];
//将数据数组转换为标签数组，使用map方法
const ul=(
<ul>
{names.map((name,index)=><li key={index}>{name}</li>)}
</ul>
);
reactDom.render(ul,document.getElementById("example1"))
</script>
</head>
<body>
<h2>这是个例子</h2>
<div id="example1"></div>
</body>
</html>
效果：
