|
|
@@ -13,11 +13,33 @@
|
|
|
<script src="./react-dom.development.js"></script>
|
|
|
</head>
|
|
|
<body>
|
|
|
+ <!--
|
|
|
+ React:用于构建web与原生交互界面的库
|
|
|
+ vue和react区别：
|
|
|
+ vue.js => 偏向于html扩展
|
|
|
+ react.js => 偏向于javascript扩展
|
|
|
+ vue:
|
|
|
+ 1.直接引入vue第三方库
|
|
|
+ 2.vue.ui去创建
|
|
|
+ 3.vue create 项目名
|
|
|
+ react：
|
|
|
+ 通过第三方库引入
|
|
|
+ -->
|
|
|
<div id="root"></div>
|
|
|
+ <!--
|
|
|
+ type ="text/babel"
|
|
|
+ 告诉babel库 将jsx转成js
|
|
|
+ -->
|
|
|
<script type="text/babel">
|
|
|
+ // 需求：将标签渲染到页面中
|
|
|
+ //创建标签
|
|
|
const text = <div>这是一块div</div>
|
|
|
+ // 获取渲染位置
|
|
|
const gettext =document.getElementById("root");
|
|
|
- ReactDOM.createRoot(gettext).render(text)
|
|
|
+ // 将新标签渲染到页面上
|
|
|
+ // ReactDOM.createRoot(指定渲染页面)
|
|
|
+ // render(渲染的内容)
|
|
|
+ ReactDOM.createRoot(gettext).render(text);
|
|
|
</script>
|
|
|
</body>
|
|
|
</html>
|
Yangbing