引入react相关的js文件(需下载文件引入项目)
<script src="./lib/react.development.js"></script>
<script src="./lib/react-dom.development.js"></script>
具体详见代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.p1 {
border: 1px solid #f00;
}
</style>
</head>
<body>
<div id="app"></div>
</body>
<script src="./lib/react.development.js"></script>
<script src="./lib/react-dom.development.js"></script>
<script>
//获取容器
const container = document.querySelector('#app')
//基于容器生成React根元素
const root = ReactDOM.createRoot(container)
//创建一个虚拟dom函数
const h = React.createElement
//通过虚拟dom函数生成并渲染dom到浏览器上
root.render(
h('div', {
className: 'test',
title: '哈哈哈'
}, '我是一个小小div', h('p', {
className: 'p1'
}, '我是一个段落标签')))
</script>
</html>