Let's say there is a <div> somewhere in your HTML file:
假设你的HTML文件里面有一个 <div> :
<div id="root"></div>
We call this a "root" DOM node because everything inside it will be managed by React DOM.
我们称他为根DOM节点,因为它内部的每一个东西都将被React DOM管理。
Applications built with just React usually have a single root DOM node. If you are integrating React into an existing app, you may have as many isolated root DOM nodes as you like.
一般使用React创建的应用都有一个单独的根DOM节点。如果你想把React整合到你现有的应用当中去,你可以使用多个孤立的根DOM节点。
To render a React element into a root DOM node, pass both to ReactDOM.render():
渲染一个React元素到根DOM节点,传递给ReactDOM.render():
const element = <h1>Hello world!</h1>;
ReactDOM.render(
element,
document.getElementById('root')
);
Try it on CodePen.
尝试在CodePen写这段代码。
It displays "Hello World" on the page.
它将在页面上显示“Hello World”。