1.代码
<!DOCTYPE html>
<html lang="zh-cn"> <head>
<meta charset="UTF-8">
<title>Document</title>
</head> <body>
<script src="./react-0.13.2/build/react.js"></script>
<script src="./react-0.13.2/build/JSXTransformer.js"></script>
<script type="text/jsx">
var style = {
color : "red",
border: "1px #000 solid",
};
var HelloWorld = React.createClass({
render: function(){
return <p>你好React</p>;
}
});
React.render(<div style={style}><HelloWorld></HelloWorld></div>, document.body);
</script>
</body> </html>
2.运行结果
3.运行后源码
<html lang="zh-cn"><head>
<meta charset="UTF-8">
<title>Document</title>
<script>
var style = {
color : "red",
border: "1px #000 solid",
};
var HelloWorld = React.createClass({displayName: "HelloWorld",
render: function(){
return React.createElement("p", null, "你好React");
}
});
React.render(React.createElement("div", {style: style}, React.createElement(HelloWorld, null)), document.body); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHJhbnNmb3JtZWQuanMiLCJzb3VyY2VzIjpbIklubGluZSBKU1ggc2NyaXB0Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBO0VBQ0UsSUFBSSxLQUFLLEdBQUc7R0FDWCxLQUFLLEdBQUcsS0FBSztHQUNiLE1BQU0sRUFBRSxnQkFBZ0I7R0FDeEIsQ0FBQztFQUNGLElBQUksZ0NBQWdDLDBCQUFBO0dBQ25DLE1BQU0sRUFBRSxVQUFVO0lBQ2pCLE9BQU8sb0JBQUEsR0FBRSxFQUFBLElBQUMsRUFBQSxTQUFXLENBQUEsQ0FBQztJQUN0QjtHQUNELENBQUMsQ0FBQztFQUNILEtBQUssQ0FBQyxNQUFNLENBQUMsb0JBQUEsS0FBSSxFQUFBLENBQUEsQ0FBQyxLQUFBLEVBQUssQ0FBRSxLQUFPLENBQUEsRUFBQSxvQkFBQyxVQUFVLEVBQUEsSUFBYyxDQUFNLENBQUEsRUFBRSxRQUFRLENBQUMsSUFBSSxDQUFDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJcblx0XHR2YXIgc3R5bGUgPSB7XG5cdFx0XHRjb2xvciA6IFwicmVkXCIsXG5cdFx0XHRib3JkZXI6IFwiMXB4ICMwMDAgc29saWRcIixcblx0XHR9O1xuXHRcdHZhciBIZWxsb1dvcmxkID0gUmVhY3QuY3JlYXRlQ2xhc3Moe1xuXHRcdFx0cmVuZGVyOiBmdW5jdGlvbigpe1xuXHRcdFx0XHRyZXR1cm4gPHA+5L2g5aW9UmVhY3Q8L3A+O1xuXHRcdFx0fVxuXHRcdH0pO1xuXHRcdFJlYWN0LnJlbmRlcig8ZGl2IHN0eWxlPXtzdHlsZX0+PEhlbGxvV29ybGQ+PC9IZWxsb1dvcmxkPjwvZGl2PiwgZG9jdW1lbnQuYm9keSk7XG5cdCJdfQ==</script></head> <body><div style="color:red;border:1px #000 solid;" data-reactid=".0"><p data-reactid=".0.0">你好React</p></div></body></html>